vue 自定义锁功能
//主函数中的锁的使用
import * as tools from "@/utils"; const lockObj = new tools.LockHandler();//构造一把锁 export default defineComponent({ setup() { const search = (params, callback) => {//获取数据 getDataList(params) .then((res) => { 。。。 if (callback) callback();//执行回调函数,锁将在回调函数中释放 }) .catch((err) => { console.error(err); }); }; return { search, }; }, mounted() { const that = this; window.onresize = () => { if (!lockObj.isLock()) {//如果没有上锁 lockObj.lock();//上锁 //注意第2个参数是获取数据后的回调函数 that.search(null, () => { lockObj.unLock(); }); } }; this.search(); }, });
//utils中锁的定义
//src/utils/index.js export class LockHandler { #_lock; constructor() { this.#_lock = false; } isLock = () => { return this.#_lock; }; lock = () => { this.#_lock = true; }; unLock = () => { this.#_lock = false; }; }