600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > 微信小程序连续点击多次跳转页面问题的解决办法

微信小程序连续点击多次跳转页面问题的解决办法

时间:2023-01-21 16:53:15

相关推荐

微信小程序连续点击多次跳转页面问题的解决办法

问题:

在view标签中(或button标签)添加了一个bindtap点击方法,点击跳转到指定页面。当你快速连续点击多次的时候会跳转多次页面,特别是网络卡或者手机卡顿的时候,非常影响用户使用体验。**

wxml:

![在这里插入图片描述](https://img-/202516232853.png

解决办法

函数节流(throttle):在一段时间内多次点击按钮只会执行第一次的函数。代码如下:

在/utils/util.js(工具类)中写入throttle方法:

/utils/util.js:

function throttle(fn, gapTime) {

if (gapTime == null || gapTime == undefined) {

gapTime = 1500

}

let _lastTime = null

// 返回新的函数

return function () {

let _nowTime = + new Date()

if (_nowTime - _lastTime > gapTime || !_lastTime) {

fn.apply(this, arguments) //将this和参数传给原函数

_lastTime = _nowTime

}

}

}

module.exports = {

throttle: throttle

}

/pages/throttle/throttle.wxml:

/pages/throttle/throttle.js

const util = require(’…/…/utils/util.js’)

Page({

data: {

text: ‘tomfriwel’

},

onLoad: function (options) {

},

moreNewsClick: util.throttle(function (e) {

console.log(this)

console.log(e)

console.log((new Date()).getSeconds())

}, 1000)

})

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。