vue3子组件中怎样引用父组件的函数

在Vue 3中，子组件可以通过`$emit`方法来触发父组件的函数。在子组件中，可以使用`this.$emit("父组件传递过来的函数", "子组件数据")`来触发父组件的函数。例如，在子组件的方法中可以这样写：

methods: {
  childFun() {
    this.$emit("fatherMethod", "子组件数据");
  }
}

这样就可以通过`this.$emit`来触发父组件传递过来的函数，并将子组件的数据作为参数传递给父组件的函数。[1]

另外，Vue 3中也可以通过`$parent`来访问父组件的实例，从而调用父组件的方法。在子组件中，可以使用`this.$parent.parentFun`来调用父组件的方法。例如：

methods: {
  childFun() {
    this.$parent.parentFun("子组件数据");
  }
}

这样就可以直接调用父组件的方法，并将子组件的数据作为参数传递给父组件的方法。[2]

还有一种方法是在父组件中给子组件添加一个自定义函数，并将父组件的方法传递给子组件。在父组件中，可以这样写：

<template>
  <div>
    父组件
    <child @fatherMethod="parentFun"></child>
  </div>
</template>

在子组件中，可以通过`$emit`来触发父组件传递过来的函数。例如：

methods: {
  childFun() {
    this.$emit("fatherMethod", "子组件数据");
  }
}

这样就可以在子组件中通过`this.$emit`来触发父组件传递过来的函数，并将子组件的数据作为参数传递给父组件的函数。[3]