Laravel + Vue Js : How can i hide a bootstraps 4 modal on getting response from Axios request

Question

I am using Laravel 5 with VueJs. I have a simple bootstrap4 modal having 3 input fields. On click submit data is sent to the database using AXIOS post request.

Now I want when I get a response (success) that bootstrap modal should hide. How can I achieve this?

code :

<script>
    export default{
      data(){
        return{
          list:{
          name:'',
          email:'',
          phone:''
        }
      }

      },
      methods:{
        save(){
          axios.post('/phonebook',this.$data.list).then((response)=>console.log(response))
  .catch((error)=>console.log(error))
        }

      }

    }
</script>

Answer 1

You can use like this:

methods: {
  // ...
  if(response.status===200) this.closeModal();
  // ...
  closeModal() {
    $('#modal').modal('hide');
  }
}