事件

元件與其祖先/後代通訊的方式之一是通過自定義通訊事件。所有 Vue 例項也是發射器並實現自定義事件介面，以促進元件樹內的通訊。我們可以使用以下內容：

• $on：聽取這些元件祖先或後代發出的事件。
• $broadcast：發出一個向下傳播給所有後代的事件。
• $dispatch：發出一個事件，該事件首先在元件本身上觸發，然後向上傳播到所有祖先。
• $emit：觸發自我事件。

例如，我們希望在表單提交時隱藏表單元件內的特定按鈕元件。在父元素上：

var FormComponent = Vue.extend({
  // ...
  components: {
    ButtonComponent
  },
  methods: {
    onSubmit () {
        this.$broadcast('submit-form')
    }
  }
})

在子元素上：

var FormComponent = Vue.extend({
  // ...
  events: {
    'submit-form': function () {
        console.log('I should be hiding');
    }
  }
})

要注意的一些事項：

• 每當一個事件發現一個正在偵聽它並被觸發的元件時，它將停止傳播，除非該元件中的函式回撥返回 true。
• $dispatch() 總是先觸發發射它的元件。
• 我們可以將任意數量的引數傳遞給事件處理程式。做 this.$broadcast('submit-form', this.formData, this.formStatus) 允許我們訪問像'submit-form': function (formData, formStatus) {} 這樣的引數