父组件 调用子组件的方法

在Vue.js中，可以通过`ref`属性来引用子组件，并进而调用其内部的方法。下面是一些关于如何从父组件调用子组件方法的具体步骤：

### 使用`ref`调用子组件方法

#### 示例代码：

假设我们有如下的HTML结构与JavaScript逻辑：

<template>
    <div class="parent">
        <!-- 这里的 ref 属性帮助我们识别子组件 -->
        <child-component ref="child" />
    </div>
</template>

<script>
export default {
    components: {
        childComponent: /* 子组件定义 */
    },
    methods: {
        triggerChildMethod() {
            // 获取子组件实例并调用其方法
            this.$refs.child.triggerMyMethod();
        }
    }
};
</script>

在这个示例中，我们首先定义了一个名为 `triggerChildMethod` 的方法，在该方法中，我们可以访问到子组件的实例，并通过 `.triggerMyMethod()` 来调用子组件内部定义的方法。

#### 方法步骤：

1. **添加`ref`**：在子组件标签上使用`ref`属性标识子组件，以便父组件可以引用它。

   <child-component ref="child" />

2. **创建方法**：在父组件的`methods`部分定义一个方法，用于调用子组件内的方法。

   methods: {
      triggerChildMethod() {
         // 调用子组件的方法
      }
   }

3. **访问子组件**：利用`this.$refs`访问到子组件实例。

   this.$refs.child.triggerMyMethod();

#### 相关问题:

1. 如何在子组件内定义和使用回调函数以供外部调用？
2. 如果子组件的方法接收参数，应该如何传递这些参数给父组件调用时使用？
3. 当父组件调用子组件方法时，如何处理子组件返回的数据？