@daysnap/horn-use/es/useKeepAliveByPosition/index.js

horn use

import { ref, watch, computed } from 'vue';
import { useRoute } from 'vue-router';
import { isUndefined, isBoolean } from '@daysnap/utils';
const keepAliveList = ref();
const setState = (state, ms = 0) => {
    // fix 解决 vite 热更新触发多次更新
    if (JSON.stringify(state) !== JSON.stringify(keepAliveList.value)) {
        // fix 解决 transform keep-alive bug 问题
        setTimeout(() => (keepAliveList.value = state), ms);
    }
};
const keep = (data) => {
    const { name } = data;
    const list = [...(keepAliveList.value ?? []).filter((item) => item.name !== name), data];
    setState(list);
};
const includes = computed(() => keepAliveList.value.map((item) => item.name));
const getState = () => history.state ?? {};
export const useKeepAliveByPosition = (options) => {
    if (isUndefined(keepAliveList.value)) {
        keepAliveList.value = [];
        const route = useRoute();
        watch(() => ({ ...route }), (_, from) => {
            const { position, replaced } = getState();
            const list = (keepAliveList.value ?? []).filter((item) => {
                const { mode, name } = item;
                if (mode === 'custom') {
                    return true;
                }
                if (replaced && from.name === name) {
                    return false;
                }
                return position >= item.position;
            });
            setState(list, 300);
        });
    }
    if (!isBoolean(options)) {
        const { meta, ...rest } = useRoute();
        const { name, mode } = Object.assign({ mode: 'auto' }, rest, meta, options);
        const { position = 0 } = getState();
        if (name) {
            keep({ position, name: name, mode });
        }
    }
    return {
        keepAliveList,
        includes,
        keep,
    };
};