vue 事件相关API

监听当前实例上的自定义事件。事件可以由 vm.$emit 触发。回调函数会接收所有传入事件触发函数的额外参数。

vm.$on('test', (msg) => {
    console.log(msg)
})
父组件：
<button @click="$bus.$emit('message-close')">清空提示框</button>

触发当前实例上的事件。附加参数都会传给监听器回调。

vm.$emit('test', 'hi')
子组件：
mounted () {
  this.$bus.$on('message-close',()=>{
    this.$emit('update:show',false)
  })
}

通过在Vue原型上添加一个Vue实例作为事件总线，实现组件间相互通信，而且不受组件间关系的影响。这样做可以在任意组件中使用 this.$bus 访问到该Vue实例。典型应用：事件总线。

Vue.prototype.$bus = new Vue();

监听一个自定义事件，但是只触发一次。一旦触发之后，监听器就会被移除。

vm.$on('test', function (msg) { console.log(msg) })

移除自定义事件监听器。

vm.$off() // 移除所有的事件监听器 
vm.$off('test') // 移除该事件所有的监听器 
vm.$off('test', callback) // 只移除这个回调的监听器

ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例。范例：设置输入框焦点。

<input type="text" ref="inp" /> 
mounted(){ 
    // mounted之后才能访问到inp 
    this.$refs.inp.focus() 
}

注意：