uniapp 页面跳转通信上下级页面互传

第一种

//A页面跳转方法
xx(){
	uni.navigateTo({
		url: './olylis-cascader/demo'
	});
},
//A页面 用来回去B页面返回数据的方法
getValue(list){
	console.log(list,'B页面传递的数据')
}
----------------------------------------------------------
B页面
submit(){
	let pages = getCurrentPages()
	// 2. 上一页面实例
	// 注意是length长度,所以要想得到上一页面的实例需要 -2
	// 若要返回上上页面的实例就 -3,以此类推
	let prevPage = pages[pages.length - 2]
	// 3. 给上一页面实例绑定getValue()方法和参数(注意是$vm)
	// getValue是调用上个页面接收的方法
	prevPage.$vm.getValue(this.id)
	// 4. 返回上一页面
	uni.navigateBack({
		delta: 1 // 返回的页面数
	})
}

第二种

可指定页面跳转,跨级

//A页面 一个方法 发送/接收
insParticulars(){
	var _this = this; // 这里一定要注意, this失效
	uni.navigateTo({
		url: './particulars', //跳转指定页面
		events: {
			acceptDataFromOpenedPage: (data)=> { // B页面返回的对象
				console.log('....',data)
			},
		},
		success: (res) =>{ //发送的对象,res不用管 下面这个是固定方法,可以传一个对象
			res.eventChannel.emit('acceptDataFromOpenerPage', { 'isIns': true})
		}
	})
	
},
--------------------------------------------------------------
//B页面
//一进来接收数据
onLoad() { //注意这是onLoad 里面
	var _this = this; // 注意this失效
	// 此处声明只是为了显示看起来简洁一点
	  const eventChannel = this.getOpenerEventChannel();
	  // 接收上个页面传递的数据
	  // 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据
	  eventChannel.on('acceptDataFromOpenerPage', function(data) {
	    // 对数据做处理
		console.log(data.datalist)
	  })
},
//B页面的提交数据 返回
submit() {
	const eventChannel = this.getOpenerEventChannel();
	// 通过监听上个页面的uni.navigateTo的events中定义的事件传递参数
	eventChannel.emit('acceptDataFromOpenedPage', {data: 'xxx返回'});
	// 关闭当前页返回上一页并触发acceptDataFromOpenedPage事件
	uni.navigateBack({
	   delta: 1
	});	
},
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值