React native how to make counter

Question

Hi it's just very simple problem but why it's not working I don't know. So my code is

  const [i, seti] = useState(0);

I just want to update the state to 1 inc onPress Touchableopacity.It's not working on first tap then in second tap it starts work.

     <TouchableOpacity style={listStyles.buttonstyle2} onPress={() =>
      {     
        console.log('Before  i '+i);
              //trying to update
        seti(current => current + 1);
        console.log('After  i '+i);

        if(i%2==1) {setisPress(false); )  }
        else  {setisPress(true) }
      }
    }>

Duplicate of [useState set method not reflecting change immediately](https://stackoverflow.com/questions/54069253/usestate-set-method-not-reflecting-change-immediately) — Guy Incognito, Sep 05 '20 at 21:20
Yes looks like dup but I saw that questions but I could not apply myself — kingjulienchan, Sep 05 '20 at 21:24
So if you know that `i` doesn't change its value immediately, you can't figure out how to change the code so that it uses `i+1` instead? — Guy Incognito, Sep 05 '20 at 21:29

score 0 · Answer 1 · answered Sep 06 '20 at 05:10

use should use useEffect(()=>{...} , [i])

useEffect(()=>{
    console.log('After  i '+i);
    if(i%2==1) {setisPress(false); )  }
    else  {setisPress(true) }
}, [i]) 

return(
  <TouchableOpacity style={listStyles.buttonstyle2} onPress={() =>
      {     
        console.log('Before  i '+i);
              //trying to update
        seti(current => current + 1);
        
      }
    }>

)

React native how to make counter

1 Answers1