vue实用方法之节流

新建utils.js，我们可以让util.js作为全局，在main.js上写入如下代码：

import Vue from "vue";

import utils from '@/libs/utils.js';

Vue.prototype.$utils = utils;

1.utils.js

let throttleStop = false;

//节流
throttle(callback){
	if(throttleStop){
		return;
	}
	throttleStop = true;
	callback(()=>{
		throttleStop = false;
	})
}

2.throttleStop变量是控制方法是否继续执行，如果为true阻止，false方行，有了throttleStop，我们就可以在需要节流的地方使用该方法，具体操作如下：

this.utils.throttle((resolve)=>{
	console.log('执行了');
	setTimeout(()=>{
		resolve();   //本次函数执行完需调用resolve()
	}, 2000)
})

上面代码中使用了2秒定时，就是说在这2秒内不管用户点多少次该方法，都只会执行一次，定时只是模拟请求接口的场景，根据需求自行修改，注意，最后一定要加上resolve()，否则下一轮后的方法都会不执行。

这是我对节流使用方式，有不同方式的朋友可留言交流下。