Ian Chen

１．綁定組件的自訂事件

• 在父元素依然使用 @my-test="<method>" 或是 v-on:my-test="<method>" 來綁定事件
• 在組件中使用 this.$emit("<action name>","<action params>","<action params>") 通知元素發生一個指定事件
  • 第一個參數是事件名稱
  • 第二個含後面的參數都是發出的事件的參數，可以在接收端取得參數

<div id="app">
  <test @my-test="action"></test>
</div>

new Vue({
  el:"#app",
  methods:{
    action(value){
      alert(value);
    }
  },
  components:{
    test:{
      template:`
        <div>
          <button @click="onClick">button</button>
        </div>
      `,
      methods:{
        onClick(){
          this.$emit("my-test","123");
        }
      }
    }
  }
});

２．綁定組件的原生事件

• 在父元素的 @click 後面加上 .native
• 若組件內有多個元素，每個元素都會觸發事件

<div id="app">
  <test @click.native="action"></test>
</div>