文章阅读

沉浸阅读完整内容

写文章

vue 组件通信传递参数(任意组件传递)

正在统计阅读人数 正在统计字数
登录收藏0
字号 100%

1.main.js 中创建一个总线挂载到vue实例原型上,利用Vue实例作为中央事件总线,来触发和监听事件。实现父子、兄弟、跨级之间的通信

Vue.prototype.$bus = new Vue()

2.发送信息的组件用$emit方法,需要传入2个参数,参数一:传递的名字,参数二:传递的数据

this.$bus.$emit("sendImg", data);

3.接收参数的组件 用$on方法来接收,传入参数2个,接受参数名字,参数二:回调函数

 this.$bus.$on('sendImg',(val)=>{
            console.log(val)
        })

总结: 创建一个中央事件总线挂到vue原型上, 这个名称可以自定义,一般都是$bus,然后传递的时候,通过$emit方法,接收的时候通过$on方法。

推荐阅读

4 篇精选
文章 / 143使用vue3+TS提示模块无法找到。 文章 / 145better-scroll左右联动使用方法 文章 / 144Pinia的基本使用方法 文章 / 142echarts数据叠加统计

发表评论

评论 0

还没有评论,欢迎留下第一条讨论。

分享精彩,传递价值

生成专属海报,分享你的文章,让更多人发现好内容

浏览器不支持 Canvas,无法生成海报。

每日签到

每天来这里,记录一点持续积累。

当前积分--积分
本月签到--
本月获得--积分
正在读取