Get started with react-router-redux CDN
MIT licensed
React Router Redux: Connects Router to Redux, dispatches navigation actions.
Tags:- react
- redux
- router
Stable version
Copied!
How to start using react-router-redux CDN
import React from 'react';
import { BrowserRouter as Router, Route, Switch, ReduxRouterConnection } from 'react-router-dom';
import { createStore, applyMiddleware, compose, combineReducers } from 'redux';
import { routerReducer, syncHistoryWithStore } from 'react-router-redux';
// Sample reducers
const initialState = {};
const reducer = (state = initialState, action) => {
switch (action.type) {
// Handle actions here
default:
return state;
}
};
const rootReducer = combineReducers({
routing: routerReducer,
// Add other reducers here
});
// Create the Redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
rootReducer,
applyMiddleware(ReduxRouterConnection)
);
// Create the Router with the Redux store
const history = syncHistoryWithStore(browserHistory, store);
const RouterWithRedux = () => (
<Router history={history}>
<Switch>
<Route path="/" component={Home} />
<Route path="/about" component={About} />
{/* Add more routes here */}
</Switch>
</Router>
);
// Sample components
const Home = () => <h1>Home</h1>;
const About = () => <h1>About</h1>;
// Render the RouterWithRedux component to the DOM
ReactDOM.render(<RouterWithRedux />, document.getElementById('root'));
Copied!
Copied!