Mi informacion de contacto
Correo[email protected]
2024-07-12
한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina
La función anti-vibración es en realidad una habilidad necesaria para los estudiantes de front-end. Siempre he sido vago y tomé prestada la carga de páginas o la carga de botones para lograrlo. Recientemente, estoy desarrollando un subprograma WeChat. Demasiada carga traerá una mala experiencia. Al mismo tiempo, no es fácil usar la carga para evitar sacudidas al saltar a la página. Por lo tanto, habrá situaciones en las que varios clics consecutivos cortarán la misma página varias veces, por lo que debemos utilizar la función anti-vibración para lograrlo.
Sin más preámbulos, vayamos directo al código.
/* 防抖函数封装 */
let timer
export const debounce = (fn, delay = 500) => {
return (...args) => { // 传入形参!!!
let that = this
timer && clearTimeout(timer)
timer = setTimeout(function () {
console.log("防抖函数执行", args)
fn.apply(that, args) // 用apply指向调用debounce的对象,相当于this.fn(args);
}, delay)
}
}
También he leído muchas funciones encapsuladas escritas por otros estudiantes. O no aceptan parámetros formales, lo que hace que los parámetros externos no estén disponibles en la función anti-vibración, o la definición del temporizador se incluye en la función, lo que hace que esté disponible. Se reinicia cada vez que hago clic en Definir un temporizador, pero no logra el propósito de borrar el temporizador.
export function goPage(url) {
debounce((url) => {
url && wx.navigateTo({ url })
})(url)
}
// 页面调用
goPage('.pages/home/index')
gotoShop(value) {
debounce((value) => {
// 接收外部传来的value参数,进行后续逻辑处理
})(value) // 接收外围函数的参数,丢到防抖函数里,有兴趣的同学也可以了解一下闭包
},
En la actualidad, las dos anteriores son las aplicaciones más comunes. Si te gusta, dale el visto bueno.