1、原因
最近在做原生微信小程序转支付宝小程序,结果发现自己之前大量使用了eventChannel进行页面数据交互,结果支付宝小程序不支持eventChannel。只能想办法模拟下微信小程序里的eventChannel了。下面就是我的修改,主要在app.js增加个eventChannel对象,里面模拟下emit、on、events。这样其它页面用到的地方只需要进行小小修改就可以啦。
2、app.js新增
//app.js
//1、声明两个对象放点东西
let eventChannelData = {};//放数据
let eventChannelEvents = {};//放事件
App({
//简单模拟下eventChannel
eventChannel: {
emit: (key, value) => {
eventChannelData[key] = value;
if (
eventChannelEvents[key] &&
typeof eventChannelEvents[key] == "function"
) {
eventChannelEvents[key](value);
setTimeout(() => {
delete eventChannelEvents[key];
});
}
},
on: (key, callBack) => {
callBack && callBack(eventChannelData[key]);
setTimeout(() => {
delete eventChannelData[key];
});
},
events: eventChannelEvents,
},
onLaunch: function (options) {
},
globalData: {},
})
3、页面修改
//test.js
const app = getApp();
Page({
onLoad: function (option) {
console.log(option.query);
//原先微信小程序使用
const eventChannel = this.getOpenerEventChannel();
eventChannel.emit("acceptDataFromOpenedPage", { data: "test" });
eventChannel.emit("someEvent", { data: "test" });
// 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据
eventChannel.on("acceptDataFromOpenerPage", function (data) {
console.log(data);
});
//支付宝小程序使用
app.eventChannel.emit("acceptDataFromOpenedPage", { data: "test" });
app.eventChannel.emit("someEvent", { data: "test" });
// 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据
app.eventChannel.on("acceptDataFromOpenerPage", function (data) {
console.log(data);
});
},
goNextPage() {
//原先微信小程序里的使用
wx.navigateTo({
url: "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: "test" });
},
});
//支付宝小程序使用
wx.navigateTo({
url: "test?id=1",
success: function (res) {
// 通过eventChannel向被打开页面传送数据
app.eventChannel.emit("acceptDataFromOpenerPage", { data: "test" });
app.eventChannel.events = {
// 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据
acceptDataFromOpenedPage: function (data) {
console.log(data);
},
someEvent: function (data) {
console.log(data);
},
}
},
});
},
});
4、结束
没啦,没怎么测试,以后上线有问题再想办法改吧!