Vueでは、手ぶれや節流を防ぎ、繰り返しクリックまたは重複してインスタンスを読み込むことを防止するために使用します。
余計なことを言わないで、直接コードを入れてください。
/**
* ( )
* @param fn
* @param delay
* @returns {Function}
* @constructor
*/
export const Debounce = (fn, t) => {
let delay = t || 500;
let timer;
console.log(fn)
console.log(typeof fn)
return function () {
let args = arguments;
if(timer){
clearTimeout(timer);
}
timer = setTimeout(() => {
timer = null;
fn.apply(this, args);
}, delay);
}
};
/**
*
* @param fn
* @param interval
* @returns {Function}
* @constructor
*/
export const Throttle = (fn, t) => {
let last;
let timer;
let interval = t || 500;
return function () {
let args = arguments;
let now = +new Date();
if (last && now - last < interval) {
clearTimeout(timer);
timer = setTimeout(() => {
last = now;
fn.apply(this, args);
}, interval);
} else {
last = now;
fn.apply(this, args);
}
}
};
使い方
...
methods:{
getAliyunData:Throttle(function(){
...
},1000),
}
...
以上のように、Vueでは、手ぶれや節流を防ぎ、繰り返しクリックや重複しないようにします。つまり、小編集が皆さんに共有している内容の全てです。参考にしていただければ幸いです。どうぞよろしくお願いします。