父组件调用子组件的方法

使用$refs方法去调用

子组件代码：

<template>
  <div></div>
</template>

<script>
  export default {
    methods:{
      //命名子组件的方法，父组件将要调用这个方法
      childMethod(data) {
        console.log(data)
      }
    },
  }
</script>

父组件代码：

<template>
  <div @click="parentMethod">
    <children ref="child"></children>
  </div>
</template>

<script>
    //引入子组件
  import children from 'components/children/children.vue'
  export default {
     data(){
      return {
        flag: true
      }
    },
    components: { 
        //激活子组件     
      'children': children
    },
    methods:{
     //父组件将要去调用子组件的方法
      parentMethod() {
        console.log(this.$refs.child) //返回的是一个vue对象，所以可以直接调用其方法
        //this.flag是传参，根据需求判断是否传参
        this.$refs.child.childMethod(this.flag); 
      }
    }
  }
</script>