vue bus的使用方法,vue bus.js

　　本文主要介绍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的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。