I’m running Expo 50 with react-native 0.73.4 and react-navigation 6.
In the following code, the components are not added after the content has been fetched from the API.
If I run a refresh using the refresh control, the previous state is shown. This happens elsewhere too, but I am using the same sort of pattern throughout the app.
const ChecklistScreen = ({ navigation, route }) => {
const [checklists, setChecklists] = useState([]);
const [isRefreshing, setIsRefreshing] = useState(false);
const fetchChecklists = async () => {
setIsRefreshing(true);
setChecklists(await checklistRepository.getChecklists())
}
useEffect(() => {
fetchChecklists();
}, []);
return (
<ScrollView refreshControl={
<RefreshControl refreshing={! isRefreshing} onRefresh={fetchChecklists}
}>
{ checklists.map((checklist) => {
<Text>{checklist.name}</Text>
}) }
</ScrollView>
);
};
It is like my state is always one behind what I’m expecting.