vue3父组件怎么拿到子组件的方法

在Vue3中，父组件可以通过使用`ref`和`expose`来访问子组件的方法。通过在父组件中定义一个`ref`来关联子组件的实例，然后可以通过`value`属性来访问子组件的方法和数据。以下是两种方式实现父组件获取子组件方法的示例：

1. 组合式 API（setup API）的方式：

<template>
  <div>
    <child ref="childComp"></child>
    <button @click="onTry">点击试一试</button>
  </div>
</template>

<script>
import { ref } from 'vue';
import child from './child.vue';

export default {
  components: {
    child
  },
  setup() {
    const childComp = ref(null);

    const onTry = () => {
      let msg = childComp.value.state.title;
      childComp.value.play();
    };

    return {
      childComp,
      onTry
    };
  }
};
</script>

2. 选项式 API（option API）的方式：

<template>
  <div>
    <child ref="childComp" />
    <button @click="onClick">点击试一试</button>
  </div>
</template>

<script>
import child from './child.vue';

export default {
  components: {
    child
  },
  methods: {
    onClick() {
      let msg = this.$refs.childComp.message;
      this.$refs.childComp.play();
    }
  }
};
</script>

以上是两种常用的方式，你可以根据自己的需求选择其中一种来获取子组件的方法。