当前位置: 代码迷 >> 综合 >> vue 三种传参方式之一 非父子组建传参 $emit $on
  详细解决方案

vue 三种传参方式之一 非父子组建传参 $emit $on

热度:78   发布时间:2023-12-06 19:05:07.0

A页面 跳 B页面 带参数

‘editGoodShows‘  是这个传值的key ‘传’和‘接’要统一

方法如下 四步骤

1.eventBus.js文件如下 ,放到随便位置一般放在utils里

import Vue from 'vue'
export default new Vue()

注意:如果有报错记得最有一行加个换行

 

2.A B 页面都需要引入eventBus.js文件

import eventBus from '@/utils/eventBus'

 

3.A页面

// 接受传参 
eventBus.$on('editGoodShows', function (res) { console.log(res) })

 

4.B页面

在要使用的地方赋值 

eventBus.$emit('editGoodShows', {data: true})

注意:因为渲染机制问题,反复点击多出现

           在A页面接到很多重复参数的问题

          所以一定要调用B页面里的销毁方法代码如下

  

destroyed () {eventBus.$off('editGoodShows')
},

 

  相关解决方案