I sicerely Apologies if this has been asked before. I am a bit new to react native and react in general.
my react nativee code is not fetcing the latest datasee the code for the list component belowI would deeply appreciate it if you can tell me why this is happening and how to make it pick the latest data
import React, { Component } from "react";import { FlatList, Text, View, StyleSheet, ScrollView, ActivityIndicator} from "react-native";import Constants from "expo-constants";import { createStackNavigator } from "@react-navigation/stack";import { toCommaAmount } from "./utilities";const Stack = createStackNavigator();function MyStack() { return (<Stack.Navigator><Stack.Screen name="Home" component={ExpenseList} /><Stack.Screen name="NewTransaction" component={ExpenseForm} /></Stack.Navigator> );}function Item({ title }) { return (<View style={styles.item}><Text style={styles.title}>{title}</Text></View> );}class ExpenseList extends Component { constructor(props) { super(props); this.state = { isLoading: true, dataSource: null }; } componentDidMount() { return fetch("https://example.com/expense/api/get_all.php") .then(response => response.json()) .then(responseJson => { this.setState({ isLoading: false, dataSource: responseJson.items }); }) .catch(error => console.log(error)); } render() { if (this.state.isLoading) { return (<View style={styles.container}><ActivityIndicator /></View> ); } else { let myExpenses = this.state.dataSource.map((val, key) => { return (<View key={key} style={styles.item}><Text> {val.title} {toCommaAmount(val.amount)}</Text><Text>{val.date_time}</Text></View> ); }); return <View style={styles.container}>{myExpenses}</View>; } }}export default ExpenseList;