Vuejs：ajax验证错误消息不显示

Question

刚开始使用Laravel的vuejs，我试图使用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页面中显示。这

Answer 1

范围是不正确的，而不是使用箭头功能，不结合自己的范围：

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

     }); 
    }