React Native, issue with setting the state (setState)-CodePudding

I have an issue with my code : when I try to convert a variable to a state, my variable state pass2 that was incremented became a number 3 for all my implementations while my former variable was incremented normally. I tried using useEffect but it returns me a blank page. Same if I try to replace my former variable by my state. Why is it that the state will always be the same number? Here is the code:

  const [pass2, setPass] = useState(0);
  let pass = 0;
...
<View>
{letter.map((letter) => {
<FlatList
                    data={letter.description}
                    numColumns={2}
                    keyExtractor={(_, index) => index.toString()}
                    renderItem={({ item }) => {
                      if (pass >= letter.description?.length) {
                        pass = 0;
                        setPass((pass2) => 0);
                        pass2;
                      }
return(
        <View>
              <Text>
                            {letter.description[pass]}
                            {pass  }
                            {setPass((pass2) => pass2   1)}
                            {pass2}
                  </View>
          </Text>

)
})}

CodePudding user response：

You cant set state like this :

<View>
              <Text>
                            {letter.description[pass]}
                            {pass  }
                            {setPass((pass2) => pass2   1)}
                            {pass2}
                  
          </Text>
</View>

You need to create a function :

cost handlePress = () => {
 letter.description[pass]
 setPass(prev => {
   prev  = 1    
   })
}

    <View>
                      <Text onPress={handlePress}>{pass2}</Text>
    </View>