1.在定義組件時調用內建的 $emit 方法並傳入事件的名字，來向父級組件觸發一個事件enlarge-text：

Vue.component(‘blog-post‘, {
  props: [‘post‘],
  template: `
    <div class="blog-post">
      <h3>{{ post.title }}</h3>
      <button v-on:click="$emit(‘enlarge-text‘)">
         Enlarge text
      </button>
      <
 
div v-html="post.content"></div>
    </div>
  `
})

2.用 v-on 在上述組件上監聽這個事件，就像監聽一個原生 DOM 事件一樣：

<blog-post
  ...
  v-on:enlarge-text="postFontSize += 0.1"
></blog-post>

詳情見官網：https://cn.vuejs.org/v2/guide/components.html

[Vue]組件——通過$emit自定義組件事件