网站建站公司官网,免费企业网站建设介绍,网络科技有限公司是干嘛的,wordpress后台添加主题设置事件通信通道EventChannel实现两个页面之间的数据传输已在上篇小程序路由跳转—事件通信通道EventChannel#xff08;一#xff09;展开叙述#xff0c;接下来讨论下多个页面#xff08;三个及以上#xff09;数据的通道如何构建。
本文重点#xff1a;三个以上页面需将…事件通信通道EventChannel实现两个页面之间的数据传输已在上篇小程序路由跳转—事件通信通道EventChannel一展开叙述接下来讨论下多个页面三个及以上数据的通道如何构建。
本文重点三个以上页面需将事件通信通道保存在一个公共可访问的实例中比如app全局实例。
以下示例以三个页面为例 A页面 onLoad: function () {wx.navigateTo({url: B?id1,// events: 注册将在目标页面触发派发的同名事件的监听器events: {// 定义A页面和B页面之间的通道事件PageAacceptDataFromPageB: function (data) {console.log(B页面返回给页面A的数据, data)},// 定义A页面和C页面之间的通道事件PageAacceptDataFromPageC: function (data) {console.log(页面A收到C页面数据, data)}},success: function (res) {console.log(res.eventChannel)// 通过eventChannel向被打开页面传送数据res.eventChannel.emit(PageAacceptDataFromPageB, { data: page A-B })}})},B页面 onLoad: function (option) {//注意this.getOpenerEventChannel() 只能在navigateTo模板页面使用其他更多页面使用时//可以保存在getApp()全局实例中以备其他页面使用// 保留AB通道事件已备C页面给A页面发送数据const eventChannel this.getOpenerEventChannel()// 保留AB通道事件已备C页面给A页面发送数据getApp().pageBeventChannel eventChannel// 监听PageAacceptDataFromPageB事件获取上一页面通过eventChannel传送到当前页面的数据eventChannel.on(PageAacceptDataFromPageB, function (data) {console.log(页面B收到来自页面A的数据, data)})eventChannel.emit(PageAacceptDataFromPageB, { data: page B-A });wx.navigateTo({url: C?id1,events: {// 定义B页面和C页面之间的通道事件PageBacceptDataFromPageC: function (data) {console.log(C页面返回给页面B的数据, data)}},success: function (res) {// 通过eventChannel向被打开页面传送数据res.eventChannel.emit(PageBacceptDataFromPageC, { data: page B-C })}})},C页面 onLoad: function (option) {const eventChannel this.getOpenerEventChannel()// 监听PageBacceptDataFromPageC事件获取上一页面通过eventChannel传送到当前页面的数据eventChannel.on(PageBacceptDataFromPageC, function (data) {console.log(页面C收到来自页面B的数据, data)})eventChannel.emit(PageBacceptDataFromPageC, { data: Page C-B });// 使用AB通道的PageAacceptDataFromPageC事件给A发送数据const pageBeventChannel getApp().pageBeventChannelpageBeventChannel.emit(PageAacceptDataFromPageC, { data: Page C-A });},运行结果 至此小程序路由跳转—事件通信通道EventChannel就告一段落欢迎各位小伙伴积极互动。
