本文主要介绍vue的BUSE总线的简单使用。本文通过一个简单的案例来说明对这项技术的理解和使用。以下是详细内容，有需要的朋友可以参考一下。

vue之bus总线的简单使用

场景描述：

组件A包括组件B和组件C，组件B包括组件D，如果组件D想触发组件A中组件C的方法怎么办？

当然也有解决方案，可以用state vuex管理，也可以用$emit传输，但是我想尽量用bus bus

如下：

触发组件D中总线的发射，然后触发组件A中总线开启的方法；

D组件中

数据加载(){

Console.log(“加载触发事件后”)；

这个。$巴士。$emit('itemDataLoad ')

//这个。$巴士。$emit ('event name '，parameter)//第二个可以是参数

},

A组件中

已安装(){

//监视项目中的数据是否已加载。

这个。$巴士。$on('itemDataLoad '，()={

Console.log('数据已加载')；

})

//这个。$巴士。$on('事件名称'，回调函数(参数))

},

当然，组件C中的事件可以由此触发。组件a中的$refs。

另一步是$bus默认不存在。试着打印这个。$bus未定义。

别急，在main.js中添加$ bus

//bus bus vue实例

Vue.prototype.$bus=new Vue()

当然，总线bus在生命周期中是可以去掉的；

这个。$巴士。$ off()；

记录封装的防抖函数

//防抖功能

去抖：功能(有趣，延迟){

让定时器=空

//调用函数时接收传入的参数值.参数可以是多个

返回函数(.args) {

if (tiemr)返回

timer=setTimeout(()={

fun.apply(this，args)

}，延迟)；

}

}

常量刷新=去抖(xxx，500)

刷新('参数1 '，'参数2 '，'参数3 ')

关于vue的bus总线简单使用的这篇文章到此为止。更多关于vue的BUS bus的简单使用方法，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。