鍍金池/ 問答/HTML/ .vue單文件組件里如何為當(dāng)前組件注冊(cè)事件監(jiān)聽程序？

.vue單文件組件里如何為當(dāng)前組件注冊(cè)事件監(jiān)聽程序？

如題，在學(xué)習(xí)vue的父子組件通信的時(shí)候，一般是這么寫法：
// 組件A
bus.$emit('id-selected', 1)
// 組件B
bus.$on('id-selected', function (id) {
console.log(id)
})
但是換成.vue文件里，應(yīng)該在哪里寫這個(gè)$on方法比較好？

回答
編輯回答
毀了心

<template>

<div>
    <children-component @childrenEvent="handle"><children-component/>    
<div/>

<template/>
<script>

methods:{
    handle(){
        your code
    }
}

<script/>

2017年8月3日 05:32
編輯回答
不討喜

只要保證就執(zhí)行一次就行唄。created、mounted都可以哇（如果沒有refs啥的依賴）。

2018年5月18日 22:54
編輯回答
筱饞貓

父子組件通信，應(yīng)該是這兩種會(huì)比較方便實(shí)用：vuex或者emit&on
vuex的話如果項(xiàng)目不是非常簡(jiǎn)單那種強(qiáng)烈建議使用，它可以使項(xiàng)目的狀態(tài)，數(shù)據(jù)流動(dòng)井井有條。具體請(qǐng)參考官方文檔，不難。
如果項(xiàng)目簡(jiǎn)單的話，可以在子組件提交一個(gè)emit，我通常是寫在click事件中的，例如：

//子組件
//簡(jiǎn)便寫法，通常是寫在methods里
a.click = function(){
  //觸發(fā)父組件方法，可以攜帶一個(gè)參數(shù)
  this.$emit('event',arg)； 
}
//父組件 template
//'@' 其實(shí)就是 'v-on：'
<child @event="handler"></child>
2017年11月4日 14:42