$emit calls parent component asynchronous method simulation in Vue. Then implementation method

$emit calls parent component asynchronous method simulation.then implementation

need

There is a packaged pop-up window component. When clicking confirmation, the $emit parent component delete method is called. After the parent component delete interface is called successfully, the child component close() method needs to be called.

Method: 1 You can directly close the pop-up window by $()
Method 2: Can simulate .then implement this logic in child components

Parent component event:

    delConfirm(params, callback) {
   	  // reqName is the request name      reqName(params).then(res =&gt; {
        if () {
          this.$('Delete successfully!  ')
          callback() // The callback subcomponent closes the pop-up window          () // Refresh the list after deleting one        }
      })
    },

Subcomponent confirm button event:

    confirm() {
      // Params are parameters carried. The content of the callback after being passed to the parent component callback is the close() method      this.$emit('delConfirm', , () =&gt; {
        ()
      })
    }

$emit calls the asynchronous method of the parent component, and then executes the child component after returning the result.

Phenomenon

The method of the child component requesting the parent component to trigger data updates. Only after the data is returned can subsequent operations be performed.

solve

How to use callback functions

Parent component:

 async getTaskListDetails(callback = () =&gt; {}) {
      const { pageSize, currentPage } = 
      const [res, err] = await taskListDetails({
        limit: pageSize,
        start: pageSize * (currentPage - 1)
      })
      if (err) return this.$(err?.msg || 'Request failed')
      if ( !== 200) return this.$(res?.msg || 'Request failed')
       = res?.data?.list || []
       = .main_task
       = 
      callback()
 }

Subcomponents:

  this.$emit('updateList', (res) => {
        (res)
  })

Summarize

The above is personal experience. I hope you can give you a reference and I hope you can support me more.