Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated README to mention React Router v4 support. #20

Merged
merged 3 commits into from
Feb 11, 2018
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 25 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ dispatch Redux actions in response to route changes.
- [Hash History](#hash-history)
- [Browser History](#browser-history)
- [Browser History with React](#browser-history-with-react)
- [React Router v2/v3](#react-router)
- [React Router](#react-router)

## Install

Expand Down Expand Up @@ -318,12 +318,19 @@ available in React Router. Just pass in your `history` object to the
separate file in your application for exporting your `history` object and your
`Link` component.

If you are also using React Router, you can use the `Link` component that is shipped with React Router.

```js
// history.js

import { createBrowserHistory } from 'redux-saga-router';
import { createLink } from 'redux-saga-router/react'

// Without React Router v4:
import { createBrowserHistory } from 'redux-saga-router';

// With the history npm package:
import createBrowserHistory from 'history/createBrowserHistory';

const history = createBrowserHistory();

export const Link = createLink(history);
Expand Down Expand Up @@ -369,16 +376,22 @@ export default function App() {

### React Router

Redux Saga Router can also work in tandem with React Router v2 or v3! Instead of
Redux Saga Router can also work in tandem with React Router (v2, v3, and v4)! Instead of
using one of Redux Saga Router's history creation functions, just use your
history object from React Router.
history object from React Router (v2, v3) or use the history creation functions provided by the history npm package (v4).

```js
// saga.js

import { router } from 'redux-saga-router';

// React Router v2 and v3:
import { browserHistory as history } from 'react-router';

// React Router v4:
import createBrowserHistory from 'history/createBrowserHistory';
const history = createBrowserHistory();

const routes = {
// ...
};
Expand Down Expand Up @@ -421,12 +434,19 @@ import React from 'react';
import { render } from 'react-dom';
import { applyMiddleware, createStore } from 'redux';
import createSagaMiddleware from 'redux-saga';
import { Router, Route, browserHistory as history } from 'react-router';
import App from './App';
import Users from './Users';
import User from './User';
import mainSaga from './saga';

// React Router v2 and v3:
import { Router, Route, browserHistory as history } from 'react-router';

// React Router v4:
import createBrowserHistory from 'history/createBrowserHistory';
import { Router, Route } from 'react-router';
const history = createBrowserHistory();

function reducer() {
return {};
}
Expand Down