Home > database >  React Native non-serializable values were found in the navigation state
React Native non-serializable values were found in the navigation state

Time:09-04

i'm trying to build an app and pass parameter to between pages. so i'm using to navigation. here PageOne code:

const PageOne=({navigation})=>{
...
onPress={_ => { navigation.navigate("PageTwo", { navigation }) }}>

PageTwo codes

const SettingsPage = ({route}) => {
const {navigation} = route.params

my code is working. i mean, i can use the navigation but getting yellow alert.

CodePudding user response:

This happens when you are trying to pass a callback or something that is not serializable as a param when navigating to a new screen. in this case you don't don't need to pass navigation as a param, so replace this: navigation.navigate("PageTwo", { navigation }) with navigation.navigate("PageTwo")

and in your SettingsPage, just do the following

const SettingsPage = ({route}) => {
const navigation = useNavigation()

or

const SettingsPage = ({route, navigation}) => {
// you can get navigation from props if the component is a screen
  • Related