ahooks-vue3/lib/useDeepCompareLayoutEffect/index.js

A high-quality & reliable Vue 3 Composition API hooks library, ported from ahooks

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const lodash_1 = require("lodash");
// Deep compare layout effect using lodash isEqual
function useDeepCompareLayoutEffect(effect, deps, options) {
    let prevDeps;
    (0, vue_1.watch)(deps, (newDeps, oldDeps, onCleanup) => {
        // Use deep comparison instead of reference comparison
        if (!(0, lodash_1.isEqual)(prevDeps, newDeps)) {
            prevDeps = JSON.parse(JSON.stringify(newDeps)); // Deep clone
            return effect(newDeps, oldDeps, onCleanup);
        }
    }, { ...options, flush: 'post' } // Use 'post' flush for layout effect timing
    );
}
exports.default = useDeepCompareLayoutEffect;