主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
本文向您展示如何在小程序中使用函数节流来解决多次页面跳转的问题。 有一定的标准值。 请转告给有困难的朋友。 我希望这对你有帮助。
在使用小程序时,您会遇到网络较差或卡住的情况。 用户多次点击,认为点击无效。 最后页面跳转多次。 这个问题可以通过JS函数节流和函数防抖来解决。
根据官方文档,函数throttle指定了一个时间单位。 在这个单位时间内,触发事件的回调函数只能执行一次。 如果同一时间单位内多次触发同一个事件,则只有一次生效。 因此,按如下方式更改您的 .js 文件:
functionthrottle(fn,gapTime){if(gapTime==null||gapTime==unknown){gapTime=1500}let_lastTime=nullreturnfunction(){let_nowTime=+newDate()if(_nowTime[ k3]_lastTime > 间隙时间 || !_lastTime) {fn()_lastTime =_nowTime}}}module.exports = {throttle:throttle}/pages/throttle/throttle.wxml:tap/pages/throttle/throttle.jsconst util = require (\'../../utils/util.js\')Page({data: {text: \'tomfriwel\'} ,onLoad: function (options) {} ,tap:util.throttle(function (e ) {console.log(这个)console.log(e)console.log((newDate()).getSeconds())}, 1000)})
这样,即使你疯狂点击按钮,每秒也只会触发一次。完成吧。
但是,这种情况有一个问题。 这意味着如果你想检索this.data,则检索到的this是未定义的,或者微信组件的按钮传递给点击函数的数据也是未定义的。 由于未定义,所以节流函数还是需要稍微处理一下才能在微信小程序的页面js中可用。
造成这种情况的原因是throttle返回的新函数不再是原来的函数。 新函数对原函数进行了包装,因此组件按钮传递的参数都在新函数中。 因此,我们需要将这些参数传递给实际需要执行的函数fn。
最终的节流函数为:
functionthrottle(fn,gapTime){if(gapTime==null||gapTime==unknown){gapTime=1500}let_lastTime=null//返回新函数returnfunction(){let_nowTime=+newDate () if (_nowTime -_lastTime > gapTime || !_lastTime) { fn.apply(this, argument) //将this和参数传递给原函数_lastTime =_nowTime } }}
再次按下按钮Click让这个和e都可用:
推荐:《小程序开发教程》
PHP 快速学习视频免费教程(入门到精通)
如何学习 PHP? 我应该从哪里学习 PHP? 不用担心。 这里有简单的 PHP 学习教程(从初学者到专家)。 您可以保存并下载您想学习的朋友。
下载
这几篇文章你可能也喜欢:
- 如何实现小程序发送服务通知(小程序如何主动向用户发送通知)
- 如何获取小程序的unionid(如何获取小程序的页面路径)
- 生成海报的示例小程序(Java后端)(微信小程序生成海报演示)
- 什么是小程序? 有哪些功能?(什么是小程序?有哪些功能?)
- 介绍如何用小程序生成参数二维码(二维码+小程序参数)
本文由主机参考刊发,转载请注明:小程序通过函数调优来解决多次页面跳转的问题(小程序跳出率)。 https://zhujicankao.com/124170.html
评论前必须登录!
注册