-
-
Save vigosan/cca8c158b83fc39086ef1123e5b3992a 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