equalRef.ts

import { isEqual } from 'lodash-es'
import { customRef, computed, type ShallowRef } from 'vue'

export const useEqualRef = <T>(initValue: T): ShallowRef<T> => {
    return customRef((track, trigger) => {
        let value = initValue
        return {
            get() {
                track()
                return value
            },
            set(newValue) {
                if (!isEqual(value, newValue)) {
                    value = newValue
                    trigger()
                }
            }
        }
    })
}

const useEqualComputed = <T>(getter: () => T): ComputedRef<T> => {
    let value: T
    return computed(() => {
        const newValue = getter()
        if (!isEqual(value, newValue)) {
            value = newValue
        }
        return value
    })
}