@vgbire/react-keep-alive/dist/component/index.js

React keepAlive

import { useEffect, useState, useLayoutEffect } from 'react';
import { createPortal } from 'react-dom';
export const Component = ({ name, show, children, to, style }) => {
    const [div] = useState(() => document.createElement('div'));
    useEffect(() => {
        // 清空原来的style内联样式
        div.style.cssText = '';
        Object.keys(style || {}).forEach((key) => {
            div.style[key] = style[key];
        });
    }, [style]);
    useLayoutEffect(() => {
        var _a;
        if (show) {
            (_a = to.current) === null || _a === void 0 ? void 0 : _a.replaceChildren(div);
        }
    }, [show]);
    return createPortal(children, div, name);
};