Skip to content

Commit c796978

Browse files
arnaud-zgsupasate
authored andcommitted
Update FAQ for react native example (#363)
* Update FAQ for react native example
1 parent 06c9a10 commit c796978

File tree

2 files changed

+32
-0
lines changed

2 files changed

+32
-0
lines changed

FAQ.md

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
- [How to hot reload reducers](#how-to-hot-reload-reducers)
88
- [How to support Immutable.js](#how-to-support-immutablejs)
99
- [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)
1011
- [How to use your own context with react-redux](#how-to-use-your-own-context-with-react-redux)
1112

1213
### How to navigate with Redux action
@@ -309,6 +310,36 @@ It's easy to migrate from v4 to v5/v6.
309310
+ store.replaceReducer(nextCreateRootReducer(history))
310311
```
311312

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+
312343
### How to Use Your Own Context with react-redux
313344
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.
314345
```js

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@ See the [examples](https://github.com/supasate/connected-react-router/tree/maste
138138
- [How to support Immutable.js](https://github.com/supasate/connected-react-router/tree/master/FAQ.md#how-to-support-immutablejs)
139139
- [How to implement server-side rendering](https://medium.com/@cereallarceny/server-side-rendering-in-create-react-app-with-all-the-goodies-without-ejecting-4c889d7db25e) ([sample codebase](https://github.com/cereallarceny/cra-ssr))
140140
- [How to migrate from v4 to v5](https://github.com/supasate/connected-react-router/tree/master/FAQ.md#how-to-migrate-from-v4-to-v5)
141+
- [How to use connected-react-router with react native](./FAQ.md#how-to-use-connected-react-router-with-react-native)
141142
- [How to use your own context with react-redux](https://github.com/supasate/connected-react-router/tree/master/FAQ.md#how-to-use-your-own-context-with-react-redux)
142143

143144
Build

0 commit comments

Comments
 (0)