5

Currently, I am totally stuck with React Hook.

When the state changes to true it should show console.log('currentBoolean'), but that is not happening.

Not sure if I should use usePrevious for that, because when comparing numbers it works well with this code, but it seems that it is not working when I am trying to check if default boolean is changing. 

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);
frontend
  • 137
  • 1
  • 11

1 Answers1

0

Your boolean.current value will never be changed as it's useEffect callback behaves as contructor function which will run only once as we have empty dependency inside it.

Shivang Gupta
  • 3,139
  • 1
  • 25
  • 24