How to avoid reinitializing a useState variable in React Native

I am working on a music app in React Native. This page will be re-opened several times, but I do not want the trackList to reset to [] everything the page is re-rendered, but instead to retain its values. I have included a simplified version of my code:

export default function Host({ navigation }) {
  const [trackList, setTrackList] = useState([]);

  if (!existsTrackListener) {
    setTrackListener(roomID, (t) => {
      if (t != null) {
        const newArray = [...trackList, t.name];
        setTrackList(newArray);
      }
    });
    existsTrackListener = true;
  }

  return (
    <View style={styles.container}>
      <FlatList
        data={trackList}
        renderItem={({ item }) => <Text style={styles.item}>{item}</Text>}
      />
    </View>
  );
}