reactjs - 设置状态原因使用备忘录重新渲染

Question

这是代码，不知道为什么 Mem 在设置状态后重新渲染，因为它是一个记忆组件，或者如果我想记住具有设置状态的组件，我应该使用 useRef？这么傻？？

const Demo = () => {
    console.log("render")

    const data = LoadSomeData();

    return (<>{data.id}</>)
}

const Mycomp = ({...props}) => {

    const [showSearch, setShowSearch] = useState(false);

    const Mem = useMemo(() => <Demo />, [props.iwandToReloadData]);

    return (
        <>
        { showSearch ? 
            <button onClick={()=>setShowSearch(false)}>Back</button>
        :
        <>
            {Mem}
            <button onClick={()=>setShowSearch(true)}>Search</button>
        </>
        }
        </>
    )
}

export default Mycomp;

Answer 1

参考 Tony Nguyen 的评论，这是因为我对记忆组件使用条件渲染，因此它会触发记忆组件的卸载。因此，什么都不能记住。

解决方案是使用 css 隐藏它而不是不为我的情况渲染它