-
-
Save moro-programmer/813fb7868e10a034df3c01251d6d70eb to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// In v2/3 you did this: | |
import ReactDOM from 'react-dom' | |
import { Router, browserHistory, Route } from 'react-router' | |
ReactDOM.render( | |
<Router> | |
<Route path="/about" component={About}/> | |
<Route path="/:username" component={User}/> | |
</Router> | |
) | |
// Those <Route> components above were fake components. They didn't | |
// really render anything. Instead, we just stripped their props and | |
// used them as config for the router. In v4, this has changed. | |
// In v4, your <Route> components actually render to the page! We split | |
// out the logic that decides which one to render into the <Switch> | |
// component. Also, we now provide a <BrowserRouter> component you can | |
// use to configure history management declaratively. | |
import ReactDOM from 'react-dom' | |
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom' | |
ReactDOM.render( | |
<Router> | |
<Switch> | |
<Route path="/about" component={About}/> | |
<Route path="/:username" component={User}/> | |
</Switch> | |
</Router> | |
) | |
// There's LOTS more to know (and a lot more advantages to doing things | |
// this way) but that should get you started! :) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment