Vuejs: сообщения об ошибках проверки AJAX не отображаются

Я только что начал с vuejs с Laravel, я пытаюсь сделать запрос с axios клиентская библиотека http.
Запросы работает нормально, но я не могу отобразить сообщения об ошибках в HTML-файл.

Вот HTML-файл

<form @submit.prevent="addJob" >

<input type="text" v-model="user.name" >
<textarea v-model="user.message"></textarea>
<button >Submit</button>
//for showing errors
<span v-if="error">{{error}} </span>
</form>

Js

export default {

data:function(){
return {
test:'hello',
more:[
{ message: 'Foo' },
{ message: 'Bar' }
],
origin:'',
user:{},
error:''
}
},
methods:{
addJob:function(e){
axios.post('/test',this.user)
.then(function (response) {
//set the error message
this.$set('error',response.data.errors);
//this will returns nothing
console.log(error);
})
.catch(function (error) {

});
}

}
}

Тем не менее response.data.errors возвращает сообщения об ошибках, но я не могу отобразить на странице HTML.

2

Решение

область действия не является правильной, вместо этого используйте функции стрелок, которые не связывают свою собственную область:

  addJob:function(e){
axios.post('/test',this.user)
.then(response => {
this.$set('error',response.data.errors);
})
.catch(function (error) {

});
}
1

Другие решения

Других решений пока нет …