Search code examples
reduxreact-native-navigationwix-react-native-navigation

wix react native navigation registerComponent React is not defined


In react-native-navigation 7.14.0, the Navigation.registerComponentWithRedux has been deprecated and it suggested that registerComponentWithRedux is deprecated and will be removed in the next version! Please use Navigation.registerComponent instead. Visit the docs for more information https://wix.github.io/react-native-navigation/api/component#registering-a-component-wrapped-with-providers

import { Provider } from 'react-redux';
const store = createStore();

Navigation.registerComponent(`navigation.playground.MyScreen`, () => (props) =>
  <Provider store={store}>
    <MyScreen {...props} />
  </Provider>,
  () => MyScreen)
);

It was working fine with registerComponentWithRedux with the deprecated warning. To get rid of the warning, I changed registerComponentWithRedux to the following and it crashed on app launched with React is not defined. Am I doing something wrong or there is a bug for registerComponent with redux provider?

import { Navigation } from 'react-native-navigation';
import { Provider } from 'react-redux';

Navigation.registerComponent(ScreenEnum.HOME_SCREEN, () => (props) =>
<Provider store={store}>
  <HomeScren {...props} />
</Provider>,
() => HomeScren);

enter image description here


Solution

  • Try:

    import React from 'react';
    import { Navigation } from 'react-native-navigation';
    import { Provider } from 'react-redux';
    
    Navigation.registerComponent(ScreenEnum.HOME_SCREEN, () => (props) =>
    <Provider store={store}>
      <HomeScreen {...props} />
    </Provider>,
    () => HomeScreen);
    

    Also note in your second example your HomeScreen component is mispelled.