Vuejs :ajax validation error messages not displaying

Just started with vuejs with Laravel , i am trying to make post request with axios http client library. Requests works fine but i can't able to display error messages in html file.

Here is the html file

<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"> </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) {

               });
          }

        }
    }

However the response.data.errors returns the error messages but i can't able to display in html page.

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2kKD770
via IFTTT