Connected-react-router: React Native Support

Created on 1 Dec 2018  路  7Comments  路  Source: supasate/connected-react-router

Does connected-react-router support React Native?

Most helpful comment

Hey,

I tried to implement it on a project, firstly it doesn't work. I have some conflict between redux and react-router-native.

Stack trace:

[18:52:34] Invariant Violation: Could not find "store" in either the context or props of "Connect(ConnectedRouterWithContext)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(ConnectedRouterWithContext)".

This error is located at:
    in Connect(ConnectedRouterWithContext) (at Router/index.tsx:35)
    in RCTView (at View.js:44)
    in IntlProvider (at Router/index.tsx:30)
    in Router (at App.tsx:59)
    in App (at registerRootComponent.js:17)
    in RootErrorBoundary (at registerRootComponent.js:16)
    in ExpoRootComponent (at renderApplication.js:34)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in AppContainer (at renderApplication.js:33)
- node_modules/react-redux/lib/components/connectAdvanced.js:131:32 in new
- node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:8039:17 in constructClassInstance
- ... 8 more stack frames from framework internals

So I try to use NativeRouter in that way, but I still have an error that tell me I have to use react-redux v6.

<Provider store={store}>
  <NativeRouter>
    <ConnectedRouter history={history}>
      <Route path={ERoutes.LOGIN} component={Login} />
    </ConnectedRouter>
  </NativeRouter>
</Provider>

After upgrade from "react-redux": "5.0.7" => "react-redux": "6.0.0", it works !

All 7 comments

It doesn't seem to work with "react native" :/

Is there anything planned for this issue ?

Hey,

I tried to implement it on a project, firstly it doesn't work. I have some conflict between redux and react-router-native.

Stack trace:

[18:52:34] Invariant Violation: Could not find "store" in either the context or props of "Connect(ConnectedRouterWithContext)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(ConnectedRouterWithContext)".

This error is located at:
    in Connect(ConnectedRouterWithContext) (at Router/index.tsx:35)
    in RCTView (at View.js:44)
    in IntlProvider (at Router/index.tsx:30)
    in Router (at App.tsx:59)
    in App (at registerRootComponent.js:17)
    in RootErrorBoundary (at registerRootComponent.js:16)
    in ExpoRootComponent (at renderApplication.js:34)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in AppContainer (at renderApplication.js:33)
- node_modules/react-redux/lib/components/connectAdvanced.js:131:32 in new
- node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:8039:17 in constructClassInstance
- ... 8 more stack frames from framework internals

So I try to use NativeRouter in that way, but I still have an error that tell me I have to use react-redux v6.

<Provider store={store}>
  <NativeRouter>
    <ConnectedRouter history={history}>
      <Route path={ERoutes.LOGIN} component={Login} />
    </ConnectedRouter>
  </NativeRouter>
</Provider>

After upgrade from "react-redux": "5.0.7" => "react-redux": "6.0.0", it works !

I'm not familiar with React Native. So, if anyone would like to contribute to FAQ or provide a working example in the examples folder, feel free to send a PR :)

Yep, I'll make a working example and submit a pull request asap.

@arnaud-zg is it still working with react-redux new version (v7.x.x)?

@HosseinAlipour Yes, it works with [email protected], but you'll have some error if you don't have access to React.memo. I guess at least we need [email protected]. If you use expo, you must at least have SDK 33.

Minimum dependencies version:

  "react": "16.6.0",
  "react-native": " 0.59.8",
  "react-redux": "7.0.0",
Was this page helpful?
0 / 5 - 0 ratings