How to use useEffect inside a View in React Native-CodePudding

I want to use an useEffect inside a return (inside a Text that is inside multiple View to be exact) and from what I know, I must use {...} in order to say that what I write is some code. Howether I got a blank screen without errors and I don't know where is the issue with my code. Here is the code:

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

                            {"\n"}
                          </Text>
                        </View>
                      );
                    }}
                  />
                </View>

letter is my data, but you can ignore it. I just keep it here to explain why I need the pass

CodePudding user response：

Why use useEffect to setState?

just set the state :

if (pass >= letter.description?.length) { setPass((prev) => 0); }

You can use UseEffect to render your component when you want to render it.

More of this here : https://reactjs.org/docs/hooks-effect.html