[Redux] Adding React Router to the Project

Source: Internet
Author: User



We'll learn how to add React Router to a Redux project and make it render your root component.






Install:


NPM Install--save React-router




import React from ‘react‘;
import {Provider} from ‘react-redux‘;
import {Router, Route} from ‘react-router‘;
import App from ‘./App‘; const Root = ({ store }) => ( <Provider store={store}>
        <Router>
            <Route path="/" component={App}/>
        </Router>
    </Provider> )

export default Root;





Router should be wrapped inside Provider and then all the children components can access the Router.






Currentlly when we open the browser, we saw the URL was like:


http://Localhost:3000/#/?_k=k4ctzs





To fix the need to import ' browserhistry ':


import React from ‘react‘;
import {Provider} from ‘react-redux‘;
import {Router, Route, browserHistory } from ‘react-router‘;
import App from ‘./App‘; const Root = ({ store }) => ( <Provider store={store}>
        <Router history={browserHistory}>
            <Route path="/" component={App}/>
        </Router>
    </Provider> )

export default Root;





[Redux] Adding React Router to the Project


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.