javascript发布订阅模式,小程序跨页面通信[亲测有效]

javascript发布订阅模式,小程序跨页面通信[亲测有效]发布订阅模式它的作用在于以下:1.发布—订阅模式可以广泛应用于异步编程中,这是一种替代传递回调函数的方案。

欢迎大家来到IT世界,在知识的湖畔探索吧!

发布订阅模式

它的作用在于以下:

1.发布—订阅模式可以广泛应用于异步编程中,这是一种替代传递回调函数的方案。 比如,我们可以订阅ajax请求的error、success等事件。或者如果想在动画的每一帧完成之后做一些事情,那我们可以订阅一个事件,然后在动画的每一帧完成之后发布这个事件。在异步编程中使用发布—订阅模式,我们就无需过多关注对象在异步运行期间的内部状态,而只需要订阅感兴趣的事件发生点。

2.一个对象不用再显式地调用另外一个对象的某个接口。发布—订阅模式让两个对象松耦合地联系在一起,虽然不太清楚彼此的细节,但这不影响它们之间相互通信。当有新的订阅者出现时,发布者的代码不需要任何修改;同样发布者需要改变时,也不会影响到之前的订阅者。只要之前约定的事件名没有变化,就 可以自由地改变它们。

使用场景如下:

javascript发布订阅模式,小程序跨页面通信[亲测有效]

javascript发布订阅模式,小程序跨页面通信[亲测有效]

javascript发布订阅模式,小程序跨页面通信[亲测有效]

小程序中使用步骤

1、App 是小程序的实例,在每个 Page 里都能通过执行 getApp 函数获取到它。我们可以把 Event 类的实例挂载在 App 中,方便每个 Page 去调用。

const Event = require('./libs/Event')
App({
 event: new Event(),
 ...
})

欢迎大家来到IT世界,在知识的湖畔探索吧!

2、订单列表页在 onLoad 生命周期中订阅 “afterPaySuccess” 事件。

欢迎大家来到IT世界,在知识的湖畔探索吧!//order_list.js
var app = getApp()
Page({
 onLoad: function(){
 app.event.listen('afterPaySuccess', this.afterPaySuccess, this)
 },
 afterPaySuccess: function(orderId) {
 ...
 },
 ...
})

3、在订单详情页支付成功的回调中,发布 “afterPaySuccess” 事件,同时带上订单 id 参数

//order_detail.js
var app = getApp()
Page({
 raisePayment: function() {
 ... 
 app.event.trigger('afterPaySuccess', orderId)
 },
 ...
})

4、所有 Page 的 onUnload 生命周期,必须注销掉之前订阅的事件。注销方法 off 的调用姿势有三种,不过还是建议注销当前 Page 所订阅的事件,而不是注销所有的。

欢迎大家来到IT世界,在知识的湖畔探索吧!var app = getApp()
Page({
 onUnload: function(){
 // remove all
 app.event.remove()
 // remove all callbacks
 app.event.remove('afterPaySuccess')
 // remove specific callbacks
 app.event.remove('afterPaySuccess', this.afterPaySuccess)
 },
 ...
})

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://itzsg.com/17557.html

(0)

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

联系我们YX

mu99908888

在线咨询: 微信交谈

邮件:itzsgw@126.com

工作时间:时刻准备着!

关注微信