vue3怎么父组件调用子组件方法

在Vue3中，父组件可以通过props向下传递数据，同时也可以使用自定义事件（$emit）来调用子组件的方法。这里是一个基本的例子：

1. **通过props传递数据**：
- 父组件定义一个方法并传给子组件作为props：

     // 父组件
     <template>
       <child-component :parentMethod="callChildMethod" />
     </template>

     <script>
       export default {
         methods: {
           callChildMethod() {
             this.$refs.childComponent.childMethod();
           }
         }
       }
     </script>

- 子组件接受这个方法并执行：

     // 子组件
     props: ['parentMethod'],
     methods: {
       childMethod() {
         console.log('子组件方法被调用了');
       }
     }

2. **通过$emit触发自定义事件**：
- 在子组件中定义一个自定义事件，并在需要被调用的地方触发：

     // 子组件
     methods: {
       someAction() {
         this.$emit('custom-event', '参数');
       }
     }

- 父组件监听这个事件并处理：

     // 父组件
     <template>
       <child-component @custom-event="handleCustomEvent" />
     </template>

     <script>
       export default {
         methods: {
           handleCustomEvent(param) {
             console.log('子组件方法被调用，参数:', param);
           }
         }
       }
     </script>

相关问题--
1. Vue3中的$emit和props有什么区别？
2. 如何确保在子组件方法执行后父组件的回调函数会被调用？
3. 在大型项目中，如何管理复杂的父子组件通信？