When I try and pass parameters into another screen with react navigation, the second screen will get give “cannot read property ‘params’ of undefined”. I am using react tabs navigation and my code is based on https://github.com/expo/expo/tree/main/templates/expo-template-tabs.

index.jsx:

navigation.navigate('(tabs)', {screen: 'screen2', params: {data: 'test'}})

screen2.jsx:

export default function ScreenTwo({ route }) {

  console.log(route.params.data)

  return (
    <ThemedView
      style={{
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
      }}
    >
      <ThemedText type="title">{route.params.data}</ThemedText>
    </ThemedView>
  );
}

I have tried using the useRoute hook to access the params object and it logged undefined.