javascript - 如何使用 React Hook useEffect 检查状态默认 bool 值 false 是否更改为 true

Question

目前，我完全被 所困扰 react 钩子(Hook) .

当状态变为 true它应该显示 console.log('currentBoolean') ,
但这并没有发生。

不确定我是否应该使用 usePrevious为此，因为在比较数字时它可以很好地与此代码配合使用，但是当我尝试检查默认 bool 值是否正在更改时，它似乎不起作用。

const MemoryPageTwo = ({ disabledAllCards }) => {
    const boolean = useRef(null);
    const [ isCurrentBoolean , setLevel ] = useState(false);

    useEffect(() => {
        console.log(isCurrentBoolean);
        if(isCurrentBoolean) {
            console.log('currentBoolean');
        }

    }, [isCurrentBoolean]);
    
    useEffect(() => {
        const storedBoolean = disabledAllCards ;
      
        boolean.current = storedBoolean;
        return () => storedBoolean
    }, []);

    //
    useEffect(() => {
        setLevel(boolean.current !== disabledAllCards);
    },[boolean.current, disabledAllCards]);
}

const mapStateToProps = state => {
    console.log(state.app.disableCards); // default is false, but this will be true if the memorycard matches 
    return { 
        disabledAllCards: state.app.disableCards || [],
    }
}

export default connect(mapStateToProps, null)(MemoryPageTwo);

Answer 1

你的 boolean.current 值永远不会改变，因为它的 useEffect 回调表现为构造函数，它只会运行一次，因为我们里面有空的依赖项。