vue2父组件调用子函数

在Vue.js 2中，父组件调用子组件的方法有几种方式：

1. 使用`ref`引用子组件并直接调用子组件的方法：
在父组件中使用`ref`属性给子组件起一个名称，然后就可以通过该名称来访问子组件的方法。

   <template>
     <div>
       <ChildComponent ref="child"></ChildComponent>
       <button @click="callChildMethod">调用子组件方法</button>
     </div>
   </template>
   
   <script>
   import ChildComponent from './ChildComponent.vue';
   
   export default {
     components: {
       ChildComponent
     },
     methods: {
       callChildMethod() {
         this.$refs.child.childMethod();
       }
     }
   }
   </script>

2. 使用事件机制：
子组件可以通过`$emit`方法触发一个自定义事件，在父组件中监听该事件，并执行相应的方法。

   <!-- ChildComponent.vue -->
   <template>
     <div>
       <button @click="childMethod">子组件方法</button>
     </div>
   </template>
   
   <script>
   export default {
     methods: {
       childMethod() {
         this.$emit('child-method');
       }
     }
   }
   </script>
   
   <!-- ParentComponent.vue -->
   <template>
     <div>
       <ChildComponent @child-method="parentMethod"></ChildComponent>
     </div>
   </template>
   
   <script>
   import ChildComponent from './ChildComponent.vue';
   
   export default {
     components: {
       ChildComponent
     },
     methods: {
       parentMethod() {
         console.log('父组件方法被调用');
       }
     }
   }
   </script>

这些是两种常见的父组件调用子组件方法的方式，你可以根据实际需求选择合适的方法。