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
});
},

原文地址：https://blog.csdn.net/qq_45777315/article/details/137925776

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！