导致从其他组件React.js重新渲染

Question

我想从另一个组件中进行重新渲染，以避免“触发组件”重新渲染。

const App = () => {

    const [isPopUpActive, setIsPopUpActive] = useState(false)

    const popUpOnOff = () => {
        if(isPopUpActive)
            setIsPopUpActive(false)
        else
            setIsPopUpActive(true)
    }

    return (
        <div>
            <SomeComponent
                trigger={popUpOnOff}
            />
            <PopUpComponent
                isActive={isPopUpActive}
            />
        </div>
    )
}

我认为用SomeComponent包裹React.memo并在PopUpComponent中更改道具会做到这一点，但是在trigger中调用SomeComponent函数-提供一切。有没有办法避免第一个组件重新渲染？

Answer 1

ON函数的标识在每个渲染器上都会更改，因此已记忆的组件无法执行任何操作。

您将需要记住该回调，使其依赖于它使用的数据：

popUpOnOff