Olá pessoal, estou com um problema em meu código.
Ele dá a seguinte mensagem de erro: vue.js:1705 TypeError: Cannot read property ‘get’ of undefined
Estou usando o lite-server para comunicação front-end e spring-boot para back-end.
Acho que estou fazendo algo de errado nas declarações de métodos.
Abaixo segue o código:
<!doctype html>
<title>Lista de Pacientes</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/vue.js"></script>
Toggle navigation
Home
</div>
</div>
<main role="main" class="col-sm-9 ml-sm-auto col-md-10 pt-3">
<h1>Pacientes</h1>
<h2>Lista de informações</h2>
</br>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>Nome</th>
<th>Responsável</th>
<th>Telefone</th>
<th>Celular</th>
</tr>
</thead>
<tbody>
<tr>
<td>Jaqueline da Silva</td>
<td>---</td>
<td>67 3333-3333</td>
<td>67 99999-9999</td>
</tr>
<tr>
<td>Pedro Souza</td>
<td>Marcia Gonçalves</td>
<td>67 2222-2222</td>
<td>67 98888-9996</td>
</tr>
<tr>
<td>Mauro Cortana</td>
<td>---</td>
<td>67 6666-5555</td>
<td>67 95555-6666</td>
</tr>
<tr>
<td>Carina Silveira</td>
<td>Alberto Lima</td>
<td>65 3222-5555</td>
<td>65 96665-1111</td>
</tr>
<tr>
<td>Maria da Silva</td>
<td>---</td>
<td>---</td>
<td>67 95556-5555</td>
</tr>
<tr>
<td>Jozé Souza</td>
<td>Carolina Arruda</td>
<td>67 3777-8888</td>
<td>67 93332-4444</td>
</tr>
<tr>
</tbody>
</table>
<div>
<div id="app">
<button type="button" v-on:click="buscarTodos">Buscar</button>
<ul style="list-style-type: none">
<li v-for="(paciente,index) in pacientes">
{{paciente.id}},{{paciente.nome}},{{paciente.cpf}}
</li>
</ul>
</div>
<button type="submit" class="btn btn-primary">Novo Paciente</button>
<a href="cadastro_paciente.html"></a>
</div>
</main>
</div>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
pacientes:[],
nome:"",
cpf:"",
rg:"",
dataNasc:"",
sexo:"",
responsavel:"",
cpfResponsavel:"",
endereco:"",
telefone:"",
celular:"",
email:"",
recibo:"false",
convenio:"",
validadeConvenio:""
},
mounted: function () {
this.buscarTodos();
},
methods: {
buscarTodos:function(){
this.$http.get("http://localhost:8080/pacientecontroller")
.then(function(res){
this.paciente = res.body;
}, function (res) {
console.log(res)
});
}
}
})
</script>
<footer class="page-footer footer_index">
<div class="footer-copyright" align="center">
<div class="container" align="center">OGDP 2017© Copyright - Otávio Oshiro</div>
</div>
</footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('vendor/jquery.min.js"><\/script>')</script>
<script src="vendor/popper.min.js"></script>
Desde já agradeço.