|
7 | 7 | - [How to hot reload reducers](#how-to-hot-reload-reducers)
|
8 | 8 | - [How to support Immutable.js](#how-to-support-immutablejs)
|
9 | 9 | - [How to migrate from v4 to v5/v6](#how-to-migrate-from-v4-to-v5v6)
|
| 10 | +- [How to use connected-react-router with react native](#how-to-use-connected-react-router-with-react-native) |
10 | 11 | - [How to use your own context with react-redux](#how-to-use-your-own-context-with-react-redux)
|
11 | 12 |
|
12 | 13 | ### How to navigate with Redux action
|
@@ -309,6 +310,36 @@ It's easy to migrate from v4 to v5/v6.
|
309 | 310 | + store.replaceReducer(nextCreateRootReducer(history))
|
310 | 311 | ```
|
311 | 312 |
|
| 313 | +### How to use connected-react-router with react native |
| 314 | +#### History does not exist, how can I configure my redux store? |
| 315 | +As you know react native does not support natively the HTML5 history API, it's supposed to be available only for web browsers. This issue can be solved by using [`createMemoryHistory`](https://github.com/ReactTraining/history/blob/master/docs/GettingStarted.md#intro). |
| 316 | + |
| 317 | +Here is an example with react-redux v6.0.0. |
| 318 | + |
| 319 | +```js |
| 320 | +const history = createMemoryHistory() |
| 321 | + |
| 322 | +ReactDOM.render( |
| 323 | + <Provider store={store}> |
| 324 | + <ConnectedRouter history={history}> |
| 325 | + <Route path="/" component={myComponent} exact={true} /> |
| 326 | + </ConnectedRouter> |
| 327 | + </Provider> |
| 328 | +) |
| 329 | +``` |
| 330 | + |
| 331 | +[Example available here](./examples/react-native/src/configureStore.js) |
| 332 | + |
| 333 | +#### Get location from a screen |
| 334 | +You can access at your location interface with `history.location`. |
| 335 | + |
| 336 | +[Example available here](./examples/react-native/src/screens/Account.js) |
| 337 | + |
| 338 | +#### Go to a screen with parameter |
| 339 | +You can use `history` and navigate between screens. |
| 340 | + |
| 341 | +[Example available here](./examples/react-native/src/screens/Home.js) |
| 342 | + |
312 | 343 | ### How to Use Your Own Context with react-redux
|
313 | 344 | With react-redux v6.0.0, you can pass your own context to `<Provider>` component. So, you need to pass the same context as props to `<ConnectedRouter>` component.
|
314 | 345 | ```js
|
|
0 commit comments