Skip to content
This repository was archived by the owner on Oct 26, 2018. It is now read-only.

Commit 0b7b322

Browse files
committed
Add docs for syncHistoryWithStore's options.
1 parent 4308208 commit 0b7b322

File tree

1 file changed

+16
-2
lines changed

1 file changed

+16
-2
lines changed

README.md

+16-2
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,15 @@ history.listen(location => analyticsService.track(location.pathname))
7979

8080
For other kinds of events in your system, you can use middleware on your Redux store like normal to watch any action that is dispatched to the store.
8181

82+
#### What if I use Immutable.js with my Redux store?
83+
84+
When using a wrapper for your store's state, such as Immutable.js, you will need to change two things from the standard setup:
85+
86+
1. Provide your own reducer function that will receive actions of type `LOCATION_CHANGE` and return the payload merged into state.
87+
2. Pass a selector to access the payload state via the `selectLocationState` option on `syncHistoryWithStore`.
88+
89+
These two hooks will allow you to store the state that this library uses in whatever format or wrapper you would like.
90+
8291
#### How do I access router state in a container component?
8392

8493
React Router [provides route information via a route component's props](https://github.com/rackt/react-router/blob/latest/docs/Introduction.md#getting-url-parameters). This makes it easy to access them from a container component. When using [react-redux](https://github.com/rackt/react-redux) to `connect()` your components to state, you can access the router's props from the [2nd argument of `mapStateToProps`](https://github.com/rackt/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options):
@@ -92,7 +101,7 @@ function mapStateToProps(state, ownProps) {
92101
}
93102
```
94103

95-
You should not read the location state directly from the Redux store. This is because React Router operates asynchronously (to handle things such as dynamically-loaded components) and your component tree may not yet be updated in sync with your Redux state. You should rely on the props passed by React Router, as they are only updated after it has processed all asynchronous code.
104+
You should not read the location state directly from the Redux store. This is because React Router operates asynchronously (to handle things such as dynamically-loaded components) and your component tree may not yet be updated in sync with your Redux state. You should rely on the props passed by React Router, as they are only updated after it has processed all asynchronous code.
96105

97106
#### What if I want to issue navigation events via Redux actions?
98107

@@ -130,12 +139,17 @@ Examples from the community:
130139

131140
A reducer function that stores location updates from `history`. If you use `combineReducers`, it should be nested under the `routing` key.
132141

133-
#### `history = syncHistoryWithStore(history, store)`
142+
#### `history = syncHistoryWithStore(history, store, [options])`
134143

135144
Creates an enhanced history from the provided history. This history changes `history.listen` to pass all location updates through the provided store first. This ensures if the store is updated either from a navigation event or from a time travel action, such as a replay, the listeners of the enhanced history will stay in sync.
136145

137146
**You must provide the enhanced history to your `<Router>` component.** This ensures your routes stay in sync with your location and your store at the same time.
138147

148+
The `options` object takes in the following optional keys:
149+
150+
- `selectLocationState` - (default `state => state.routing`) A selector function to obtain the history state from your store. Useful when not using the provided `routerReducer` to store history state. Allows you to use wrappers, such as Immutable.js.
151+
- `adjustUrlOnReplay` - (default `true`) When `false`, the URL will not be kept in sync during time travel. This is useful when using `persistState` from Redux DevTools and not wanting to maintain the URL state when restoring state.
152+
139153
#### `push(location)`, `replace(location)`, `go(number)`, `goBack()`, `goForward()`
140154

141155
**You must install `routerMiddleware` for these action creators to work.**

0 commit comments

Comments
 (0)