怎么理解wx.navigateTo的events参数使用详情

站长资源 2024/11/24 佚名

12 1538 12

DDR爱好者之家 Design By 杰米

遇到一个这样的业务需求, 用户点击提现按钮, 跳转到提现处理结果页面, 为了避免提现请求被重复提交, 所以需要在用户点击了提交按钮以后就把按钮锁起来不给用户提交, 在拿到请求结果以后再把按钮打开
先看界面

再看实现逻辑

onWithdraw () {
 console.log('加锁', this.data.isWithdrawing)
 if (this.data.isWithdrawing) return
 // isWithdrawing要在data中初始化为false
 this.data.isWithdrawing = true
 console.log('按照预期, 这里在跳转之前应该只执行一次', this.data.isWithdrawing)

 req.redpack.withdraw(this.data.withDrawAmount, this.data.currentCardId)
  .then(res => {
   // 请求参数不用看, 是封装的方法
   if (res.code === 201) {
    this.data.isWithdrawing = true
    wx.navigateTo({
     url: '/pages/redpack/withdrawResult/withdrawResult'
    })
   }  
  })
}

于是我输入金额, 疯狂的点击按钮, 看到的是这样的

难道应该把this.data.isWithdrawing = true放在 wx.navigateTo后"text-align: center">

噢...我懂了, this.data.isWithdrawing = true应该放在complete回调里去支持, 于是我把代码改成这样:

测试

额......

由此我推断, complete回调是在页面跳转前执行的, 跳转前把锁解开, 然后我手速又比较快, 所以才出现了多次执行的情况, 那究竟要怎么处理呢"text-align: left">再次翻阅文档, 一个event参数吸引了我, 但是官方写得有点模糊, 于是自己进行了代码的测试, 下面将我的理解分享给大家, 我喜欢用图形来表达, 请看图:

重点重点重点:

1) eventChannel是页面跳转时产生的一个独立于页面外的对象, 父页面和子页面都可以在eventChannel里面定义方法, 而eventChannel里面的方法在某种意义上是可以操作两个页面的数据的
2) 父页面通过events参数定义父方法一, 父方法二...
3) 子页面通过this.getOpenerEventChannel()拿到eventChannel对象, 并且通过eventChannel.on来定义子方法一, 子方法二...
4) 父页面通过success或者complete里面的res拿到eventChannel对象, 并通过res.eventChannel.emit来触发子页面通过eventChannel.on定义的方法
5) 子页面通过this.getOpenerEventChannel()拿到eventChannel对象执行emit来触发父页面定义的方法
6) 最后, 我所说的父方法, 子方法, 其实都是定义在eventChannel上的, 这样说只是方便大家理解, 父页面应该也也是可以通过emit去触发自己在events里面定义的方法的, 但是这样没有意义, 所以, 我就不做测试了,因为没有人会傻到自己跟自己通信吧, 哈哈哈...

再回到我们一开始的业务需求:
我们是不是可以这样操作, 在子页面显示的以后再去把父页面的锁打开呢？这样不就避免了重复提交的问题了吗"text-align: center">

子页面:

结果:

点返回, 再次提现

妥妥的....

wx.navigateTo,events参数,wx.navigateTo,events

DDR爱好者之家 Design By 杰米

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！

DDR爱好者之家 Design By 杰米

评论“怎么理解wx.navigateTo的events参数使用详情”

暂无评论...

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒经典版》的玩家都可以获得奖励。

更新日志

2024年11月24日

怎么理解wx.navigateTo的events参数使用详情

微信小程序手动添加收货地址省市区联动

django简单的前后端分离的数据传输实例 axios

评论“怎么理解wx.navigateTo的events参数使用详情”

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

更新日志

友情链接