How to insert data into database with vuejs using axios [Backend]

This is second part of our series "how to insert data in database table with vuejs in laravel, today we will learn how to manage our axios post request to send data to laravel controller.

Setup Script:
Open file: 'addPost.vue' in resource/js folder.

Add New function under methods:
we have to pass our input fields in this function via axios post request.
axios.post('addPost',
{
 'title': this.title,
 'content': this.content
})

response you can console or alert.
.then((res)=>
{ 
 console.log(res); 
 alert(res); 
})

Error we will pass via function then alert the error if any
.catch(function(error)
{ 
 console.log(error); 
 alert(error); 
});

Now you have return title and content inside data function. 
data()
{ 
return{
  title:'', 
  content:'' 
 }
},


Full code of our Vue Script:
export default 
{ 
 mounted(){ 
  console.log('Component mounted.') 
 },
 data(){
 return{ 
   title:'', content:'', 
   } 
  }, 
  methods:
  { addPostfun(){ 
   axios.post('addPost',{ 
    'title': this.title, 
    'content': this.content 
    })
    .then((res)=>{
      console.log(res); 
      alert(res); 
    })
   .catch(function(error){
    console.log(error); 
    alert(error); }); 
     } 
  } 
}