React Native rendering twice

Question

When call state from AsyncStorage in new page. I found error and then i tried to console.log the state in render function i found console.log twice, the first console was null and the second was state from AsyncStorage . Why it happen? How to solve this problem?

Answer 1

React will call render as many times as it requires to reflect changes on the state object, if you are asynchronously fetching data and updating the state, you will see a console.log message as the component is first rendered, and once again once the data is fetched and the state updated.

In other words, working as expected, if you want to only log whatever message just once, try moving this line to the component constructor or componentDidMount methods.