vue中在子组件中调用父组件的方法

在Vue.js中，子组件想要调用父组件的方法，可以使用`$emit`事件系统。当子组件需要通知父组件发生了一些事情，并希望父组件处理这个事件时，它会触发一个自定义事件并将数据作为参数传递过去。

以下是基本步骤：

1. **定义父组件**：
父组件需要声明一个方法，比如`handleChildAction`：

   <template>
     <div>
       <child-component @child-action="handleChildAction"></child-component>
     </div>
   </template>

   <script>
   export default {
     methods: {
       handleChildAction(data) {
         // 父组件在此处处理接收到的数据
       }
     }
   }
   </script>

2. **子组件触发事件**：
子组件需要有一个自定义事件，通常命名为与父组件绑定的事件名相同，例如：

   <template>
     <button @click="doSomething">触发父方法</button>
   </template>

   <script>
   export default {
     methods: {
       doSomething() {
         this.$emit('child-action', { someData: 'from child' }); // 触发并传参
       }
     }
   }
   </script>

通过这种方式，当用户点击子组件的按钮时，会触发`child-action`事件，父组件的`handleChildAction`方法就会被调用，可以获取到子组件传递过来的数据。