vue4 调用子组件方法

在Vue 3及以上版本中，可以使用`ref`来获取子组件实例，并通过该实例调用子组件的方法。具体步骤如下：

1. 在子组件上定义`ref`属性，例如`ref="child"`。

2. 在父组件中使用`ref`获取子组件实例，例如`const childComponent = ref();`。

3. 在子组件渲染完成后，将子组件实例赋值给`ref`，例如`<ChildComponent ref="child" />`。

4. 在父组件中通过`childComponent.value`获取子组件实例，并调用子组件的方法，例如`childComponent.value.methodName()`。

下面是一个示例代码：

<template>
  <div>
    <ChildComponent ref="child" />
    <button @click="callChildMethod">调用子组件方法</button>
  </div>
</template>

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

export default {
  components: {
    ChildComponent,  },
  setup() {
    const childComponent = ref();

    const callChildMethod = () => {
      childComponent.value.methodName();
    };

    return {
      childComponent,
      callChildMethod,
    };
  },
};
</script>

其中，`ChildComponent`是子组件的名称，`methodName`是子组件中需要调用的方法名。

--相关问题--:
1. Vue 3中如何在子组件中定义方法并暴露给父组件调用