hfysite/until/vue/hooks.js

let zIndex = 1000;


/**
 * 各个弹层组件应用的定位层级
 * - 该方法调用一次之后，就会累加一次层级
 * - 保证所有弹层按照书写顺序去排列定位层级
 */
export function usezIndex() {
  const val = zIndex;
  zIndex++;
  return val;
}

// 声明
// data 为数据
// delay 为时间。delay = null 则直接不使用 防抖 方案
function debounceRef (data, delay = 300) {
  // 定时器
  let timer = null
  // 数据
  const value = {value: data}
  // 创建 proxy 实例
  const proxy = new Proxy(value, {
    get(target, property) {
      // 返回当前值
      return target[property]
    },
    // set 参数说明
    // target：目标, property：属性, newValue 值, receiver：接收者
    set(target, property, newValue, receiver) {
      // 定时器判断，如果存在则清除当前定时器
      if(timer != null){
        // 清除定时器
        clearTimeout(timer)
        // 将 timer 恢复默认值
        timer = null
      }
      // 赋值并创建定时器
      timer = setTimeout(() => {
        // 修改值
        target[property] = newValue
      }, delay)
      // 让 set 一直返回 true
      // 不返回 true，则会报下列错误： 'set' on proxy: trap returned falsish for property 'value'
      return true;
    }
  })
  // 判断 delay === null，等于则返回未代理的对象，反之
  return delay === null ?value : proxy
}