How to pass data back to previous screen in react native navigation v5?

Question

I just updated to react native navigation version 5. Now I am trying to send data back to previous screen on goBack() call.

I push next view with

const onSelectCountry = item => {
    console.log(item);
};

navigation.navigate('SelectionScreen', {
        onSelect: onSelectCountry});

And making move back after selecting item from FlatList with call:

function onSelectedItem(item) {
    route.params.onSelect(item);
    navigation.goBack();
}

But by sending function over with params I get a warning: Non-serializable valuse were found in the navigation state...

Can someone please tell me correct way to do this.

Answer 1

heres is an implementaion

scereen A

const Screen1 = ({navigation, route}) => {
  const [item, setItem] = useState(null);

  useEffect(() => {
    navigation.addListener('focus', () => {
      console.log(route.params)
    })
  }, [])  

  const onPress = () => {
    navigation.navigate('Screen2', {onReturn: (item) => {
      setItem(item)
    }})
  }
  return (
    // Components
  )
}

Screen2:

const Screen2 = ({navigation, route}) => {

  useEffect(() => {
    navigation.addListener('focus', () => {
      console.log(route.params)
    })
  }, [])  

  // back Press
  const onPress = () => {
    route.params.onReturn(item);
    navigation.goBack()
  }

  return (
    // Components
  )
}