简介

对象属性频繁赋值时，增加防抖策略。通过Proxy代理整个对象；拦截属性赋值，并使用防抖策略，实现页面状态跳变优化

防抖（Debounce）是一种编程技巧，通常用于限制函数在一定时间内的调用频率。它的主要目的是防止某个函数在短时间内被频繁调用，从而减少不必要的开销和副作用。例如，当用户在一个输入框中快速输入内容时，每次输入都会触发一个搜索操作，使用防抖可以确保只有用户停止输入一段时间后才触发一次搜索。

安装使用

npm i key-debounce

参数说明

• 初始化

new KeyDebounce(initState: Object, debounceDelay:Number)

• initState：对象，设备状态对象
• debounceDelay：数字，防抖时间，单位 ms，默认 700

例子

const deviceState = new KeyDebounce({ power: 'on', temperature: 20, mode: 'auto' })

deviceStore = defineStore('deviceStore', {
    state: () => ({
        deviceState: new KeyDebounce({ power: 'on', temperature: 20, mode: 'auto' }),
    }),
})

• 更新值方法

// 立即更新，不受影响；会触发updateState的防抖
deviceState.temperature = 18
deviceState.temperature = 19
deviceState.temperature = 20

/**
 * 批量更新状态
 * 防抖周期外，第一次更新某个值会立即同步，持续调用更新某个值才会触发防抖
 * @param {Object} newState - 新状态对象
 * @param {boolean} [immediateSync=false] - 是否立即同步，默认false；
 */
updateState(newState, immediateSync)