RabbitMQ消息中间件

页面之间传参大概可分为以下几种情况：

一、上级页面 → 下级页面（单向）

uni.navigateTo:URL编程式传参

1、携带静态参数

//在起始页面跳转到test.vue页面并传递参数
//作用场景，需要提供固定传参状态的页面，一般和动态参数一起使用
uni.navigateTo({
	url: 'test?id=1&name=uniapp'
});

2、携带动态参数

//在起始页面跳转到test.vue页面并传递参数
let uniapp = {
    uniappItem: 0,
};
//当传递的参数是对象时，必须先转化为JSON格式
uni.navigateTo({
	url: 'test?id=1&name=' + JSON.stringify(uniapp),
});

3、页面接收 。注意是在onload方法中接收。

onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
		console.log(option.id); //打印出上个页面传递的参数。
		console.log(option.name); //打印出上个页面传递的参数。
	}

4、<navigator>标签传参

//此处的 :URL 是动态载入，参数是变量;
//当使用了 :URl 却使用了静态地址，有可能不生效，同样如果使用了变量却没有用 :URL 也会有问题
<navigator :url="'/pages/test/test?item='+ encodeURIComponent(JSON.stringify(item))">
</navigator>

页面接收

// 在test.vue页面接受参数
onLoad: function (option) {
	const item = JSON.parse(decodeURIComponent(option.item));
}

二、上级页面 ← 下级页面（单向）

1、uni.$on(eventName,callback)：监听事件

// 我的页面  
onLoad(){  
    // 监听事件  
    uni.$on('login',(usnerinfo)=>{  
        this.usnerinfo = usnerinfo;  
    })  
},  
onUnload() {  
    // 移除监听事件  
    uni.$off('login');  
},

2、触发事件

uni.$emit('login', {  
	avatarUrl: 'https://img-cdn-qiniu.dcloud.net.cn/uploads/nav_menu/10.jpg',  
	token: 'user123456',  
	userName: 'unier',  
	login: true  
});

三、上级页面 ↔ 下级页面（双向） 

1、上级页面内代码

// 在起始页面跳转到test.vue页面，并监听test.vue发送过来的事件数据
uni.navigateTo({
  url: 'pages/test?id=1',
  // 调用通信事件对象
  events: {
    // 获取下级页面参数：
    // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
    // 注意看下级页面中所对应的函数名，你可以定义多个方法去管理传递的参数
    acceptDataFromOpenedPage: function(data) {
      // 对数据做处理
      console.log(data)
    },
    someEvent: function(data) {
      // 对数据做处理
      console.log(data)
    }
  },
  // 发送通信方法
  success: function(res) {
    // 通过eventChannel向被打开页面传送数据
    // 其中含有两个参数，第一个是接收的函数名，第二个则是需要携带的参数
    res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'data from starter page' })
  }
})

2、下级页面内代码

// 在test.vue页面，向起始页通过事件传递数据
// 此方法不是一定要在 onLoad 内调用，哪里需要哪里调
onLoad: function(option) {
  // 此处声明只是为了显示看起来简洁一点
  const eventChannel = this.getOpenerEventChannel();
  // emit 代表的就是向上一个页面传递需要更新的数据
  eventChannel.emit('acceptDataFromOpenedPage', {data: 'data from test page'});
  eventChannel.emit('someEvent', {data: 'data from test page for someEvent'});
  // 接收上个页面传递的数据
  // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
  eventChannel.on('acceptDataFromOpenerPage', function(data) {
    // 对数据做处理
    console.log(data)
  })
}