How to call component, after submit form success?-CodePudding

I have a page with a register form, after submit form and return response success, i need to call another component in the same page, without reload page, how to do this?

Method post from form with response:

axios( {
    method: 'post',
    // url: 'https://reqres.in/api/users',
    url: 'http://127.0.0.1:8000/api/clients',
        data: contactFormData
    }).then( function ( response ) {

    // Handle success.

    console.log( response );

}).catch( function ( response ) {

    // Handle error.

    console.log( response );

});

CodePudding user response：

I assume you mean 'reveal' the component after response successful? You can try below:

<template>
  <div class="main-container">
    <div class="register-form">
      ...
    </div>
    <AnotherComponent v-if="isAnotherComponentShow" />
  </div>
</template>

Then in js part:

export default {
  data() {
    return {
      isAnotherComponentShow: false
    }
  },
  methods: {
    register() {
      axios({
        method: 'post',
        url: 'http://127.0.0.1:8000/api/clients',
        data: contactFormData
      }).then( function ( response ) {
        this.isAnotherComponentShow = true
        // handle res
      }).catch( function ( response ) {})
    }
  }
}