1
I recently created an Laravel project that is using Vuejs and Axios, and then sent it to the Heroku server, but something strange happened, the page is with the very strange view is giving error in the first line of my app.js file is where you find all the methods I am using
As you can see the error is in the first line of Vue;
This is my app.js file
import Vue from 'vue'
import axios from 'axios'
new Vue({
el: '#crud',
created: function() {
this.getRegistros();
},
data: {
registros: [],
newDesc: '',
newPreco: '',
newQtdQuartos: '',
newTipo: '',
newFinalidade: '',
newLogradouroEndereco: '',
newBairroEndereco: '',
preencherRegistro: {
'id': '',
'descricao': '',
'preco': '',
'qtdQuartos': '',
tipos: '' ,// acho que meu problema está aqui******
'finalidade': '',// acho que meu problema está aqui******
'logradouroEndereco': '',
'bairroEndereco': ''
},
errors: []
},
methods: {
getRegistros: function() {
var urlRegistro = 'imovels';
axios.get(urlRegistro).then(response => {
this.registros = response.data
});
},
editarRegistro: function(registro) {
/* alert(registro.tipos); */
this.preencherRegistro.id = registro.id;
this.preencherRegistro.descricao = registro.descricao;
this.preencherRegistro.preco = registro.preco;
this.preencherRegistro.qtdQuartos = registro.qtdQuartos;
this.preencherRegistro.tipos = registro.tipos;
this.preencherRegistro.finalidade = registro.finalidade;
this.preencherRegistro.logradouroEndereco = registro.logradouroEndereco;
this.preencherRegistro.bairroEndereco = registro.bairroEndereco;
console.log(this.preencherRegistro.tipos);
$('#edit').modal('show');
},
updateRegistro: function(id) {
var url = 'imovels/' + id;
axios.put(url, this.preencherRegistro).then(response => {
this.getRegistros();
this.preencherRegistro = { 'id': '',
'descricao': '',
'preco': '',
'qtdQuartos': '',
tipos: '' ,
'finalidade': '',
'logradouroEndereco': '',
'bairroEndereco': '' };
this.errors = [];
$('#edit').modal('hide');
toastr.success('Tarea actualizada con éxito');
}).catch(error => {
this.errors = 'Corrija para poder editar con éxito'
});
},
createRegistro: function() {
var url = 'imovels';
axios.post(url, {
descricao: this.newDesc,
preco: this.newPreco,
qtdQuartos: this.newQtdQuartos,
tipos: this.newTipo,
finalidade: this.newFinalidade,
logradouroEndereco: this.newLogradouroEndereco,
bairroEndereco: this.newBairroEndereco
}).then(response => {
this.getRegistros();
this.newDesc = '';
this.newPreco = '';
this.newQtdQuartos = '';
this.newTipo = '';
this.newFinalidade = '';
this.newLogradouroEndereco = '';
this.newBairroEndereco = '';
this.errors = [];
$('#create').modal('hide');// efetuar a execução
toastr.success('Novo imóvel criado com sucesso!');
}).catch(error => {
this.errors = error.response.data
});
},
deletarRegistro: function(registro) {
var url = 'imovels/' + registro.id;
axios.delete(url).then(response => {
this.getRegistros();
toastr.success('Registro excluído com sucesso');
});
}
}
});
I believe you’re wrong are this import s
import Vue from 'vue'
import axios from 'axios'
I have to put in the right paths, see where are my files see and Xios
I believe you’re not so hard to help me, I just don’t because I have little experience with programming.
The briefcase public is in the project root, inside the public folder has the folder lib and inside the lib folder has the files see and Xios.
The problem is possibly in the configuration of
webpack, your project is in aURLdirectly or inside a folder? is like this (www.url.com) or (www.url.com/projeto) ?– Rafael Augusto