各位大佬,如何让$emit()触发父组件的异步方法?

父组件方法包含一个axios请求,我用async/await让这个请求变成了同步的,但该方法变成了异步了,$emit()没等结果返回,就向下执行了,我给$emit() 加上await 无效!!!!
那么,各位大佬,如何让$emit()触发父组件的异步方法后,等待结果返回后再向下顺序执行?:sob:

子组件代码
  // 数据处理
  await this.$emit(
    'nodesHandle',
    zNodes
  )
  console.log('this is two')
父组件代码
async nodesHandle(nodeList) {
  const that = this
  const ids = nodeList.map(function (item) {
    return item['node_id']
  })
  // 查询状态(网络请求)
  const rs = await getOnlineList({
    'node_id_list': ids
  })
  const onlineList = rs.data.node_list
  // 数据处理
  ...
  console.log('this is one')
}
输出结果

this is two
this is one

期望结果

this is one
this is two

各位大佬,有没有解决方案或思路

<details> 好评!


async/await 只是让代码「看起来」同步化,但没有改变代码逻辑的本质。代码逻辑是异步的,那它就是异步的。

$emit() 只管触发事件,事件触发后(子)组件的逻辑任务就结束了,事件的处理消费是父组件的事,子组件管不到。而在父组件,一个事件处理过程的结束也可以看做是父组件的一个状态,那么问题就转化成「父组件的状态如何传递给子组件」。

当然,针对于你这个案例,可以有更简单的做法:

/* 子组件 */

async function someMethod () {
  // ...
  await this.$parent.nodesHandle(zNodes) // console: "this is one"
  console.log('this is two') // console: "this is two"
}

重点在 this.$parent

大佬,可我这个子组件属于公用子组件,父组件不一定有nodesHandle方法。
而且,如果$emit() 触发的父组件方法,如果不是异步的,是可以按照期望顺序执行和顺序输出的。

if 判断一下就好了,如果父组件没有那个方法就不执行。

如果父组件的方法不是异步逻辑,基于 Vue 的事件系统,一切确实会同步地执行。但你需要解决的问题是异步的情况不是吗,除非父组件的方法肯定是同步的。