子元件 ：

<template>
  <div class=“son”>
  </div>
</template>

<script>
  export default {
    data(){
      return {
      }
    },
    methods:{
      fn() {
        alert('this is son fn')
      }
    }
  }
</script>

父元件 ：

父元件： 在子元件中加上ref即可通過this.$refs.ref.method呼叫
<template
 
>
  <div @click="say">
    <son ref="sonBox"></son>
  </div>
</template>

<script>
  import son from './son.vue';
  export default {
    data(){
      return {
      }
    },
    components: {      
      son
    },
    methods:{
      say() {
        console.log(this
 
.$refs.c1) //返回的是一子元件vue物件，所以可以直接呼叫其方法
        this.$refs.sonBox.fn(); 
      }
    }
  }
</script>

當觸發父元件的click事件後，就會觸發子元件的fn方法