connect react native app.js file to redux that use react-native-router-flux

Question

in react-native app in App.js i use react-native-router-flux and connect each scene to store redux with "RouterWithRedux" as below:

export default class App extends Component {
  render() {
    const RouterWithRedux=connect()(Router);
    return (
      <Provider store={store}>
        <RouterWithRedux>
          <Scene key="root">
            <Scene key="landing" component={Landing} title="Landing" initial={true}/>
            <Scene key="pageTwo" component={PageTwo} title="PageTwo" />
            <Scene
              key="rootTabBar"
              tabs={true}
              tabBarStyle={{backgroundColor: '#ffffff'}}>
              <Scene key="home" component={Home} title="Home" icon={TabIcon} initial />
              <Scene key="search" component={Search} title="Search" icon={TabIcon} />
            </Scene>
          </Scene>
        </RouterWithRedux>
      </Provider>

    )
  }
}
export default App;

i want to use connect also App to redux to use "mapStateToProps" and "mapDispatchToProps" in app.js. how can i use this? i try

export default connect(mapStateToProps, mapDispatchToProps)(App);

but i faced with error that say:

Unhandled JS Exception: Could not find "store" in either the context or props of "Connect(App)". Either wrap the root component in a , or explicitly pass "store" as a prop to "Connect(App)".

behnam shateri behnam shateri · Accepted Answer · 2019-04-28T10:01:48

finally i found the answer that "connect()" function only works in components that are inside a tag, so we can't use it in our App.js since we're creating the store and providing it to App.js's children.

That being said, we don't need to use mapStateToProps just access the state by using store.getState() and store.dispatch().

connect react native app.js file to redux that use react-native-router-flux

1 Answers