vue3子组件调父组件方法

在Vue3中，子组件调用父组件的方法有几种写法。一种是使用异步方式，父组件定义供子组件调用的方法，并在子组件中使用`context.emit`方法触发该方法。具体写法如下：[2]

父组件：

<my-child ref="RefChild" @update:xx="xx"></my-child>

子组件：

setup(props, context) {
  function fnxx() {
    context.emit('update:xx', [实参]);
  }
  return {
    fnxx
  }
}

另一种写法是使用props方式，父组件将方法作为props传递给子组件，子组件通过调用props中的方法来触发父组件的方法。具体写法如下：[3]

父组件：

<my-child ref="RefChild" :xx="xx"></my-child>

子组件：

props: {
  xx: {
    type: Function,
    required: true
  }
},
setup(props) {
  function fnxx() {
    props.xx();
  }
  return {
    fnxx
  }
}

这两种写法都可以实现子组件调用父组件的方法，具体选择哪种写法取决于你的需求和代码结构。