@H_404_0@最近在研究vue.js,总体来说还算可以,但是在web开发群里有一些人问在单文件组件开发模式中非父子组件如何传值的问题,今天在这里讲讲,希望对大家有所帮助!
@H_4040@在官网api中的这段讲解很少,也很模糊;官网中说明如下:
@H4040@
非父子组件通信:
@H404_0@有时候两个组件也需要通信 (非父子关系)。在简单的场景下,可以使用一个空的 Vue 实例作为中央事件总线:
<div class="jb51code">
<pre class="brush:js;">
var bus = new Vue();
// 触发组件 A 中的事件
bus.$emit('id-selected',1)
// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected',function (id) {
// ...
})