Pass function callback as props to scenes

Hello, it’s me again. One question, how do we pass function type props to scenes? I am doing something like this:

const stateNavigator = new StateNavigator([
  {key: 'sceneA', trackCrumbTrail: true},
  {key: 'sceneB', trackCrumbTrail: true},
]);
const {sceneA, sceneB} = stateNavigator.states;
sceneA.renderScene = () => <Foo />;
sceneB.renderScene = ({callback}) => <Bar />;

stateNavigator.navigate("sceneB", {
  callback: () => {
    // change something
  }
})

However, the value for callback in sceneB.renderScene is undefined. It seems function type variable is erased from navigationData when encoding data to routeInfo and decoding it back from routeInfo?

[mpiannucci]

So you can pass a function as long as you pass it to render scene. Great thanks for the help!!!

[grahammendick]

You don’t have to use context. You can pass the function as a prop.

const [val, setVal] = useState(null);
const modalNavigator = useMemo(() => {
  const navigator = new StateNavigator([
    {key: ‘search’}
  ]);
  const {search} = navigator.states;
  search.renderScene = () => <Search setVal={setVal} />
  navigator.navigate('search');
  return navigator;
}, [setVal]);
return (
  <Modal>
    <NavigationHandler stateNavigator={modalNavigator}>
      <NavigationStack />
    </NavigationHandler>
  </Modal>
);