Posted By

dylansong on 06/08/16


Tagged


Versions (?)

5.index route


 / Published in: Other
 

  1. import React from 'react';
  2. import { Router, Route, Link, IndexRoute, hashHistory } from 'react-router';
  3.  
  4. const Outer = (props) => <div><h1>Our Site</h1><Links />{props.children}</div>;
  5. const About = () => <div><h1>About</h1></div>;
  6. const Contact = () => <div><h1>Contact</h1></div>;
  7.  
  8.  
  9. const Links = () =>
  10. <nav>
  11. <Link to="/">Home</Link>
  12. <Link to="/about">About</Link>
  13. <Link to="/contact">Contact</Link>
  14. </nav>
  15.  
  16.  
  17. class App extends React.Component {
  18. render(){
  19. return (
  20. <Router history={ hashHistory }>
  21. <Route path="/" component={Outer}>
  22. <IndexRoute component={About}></IndexRoute>
  23. <Route path="contact" component={Contact}></Route>
  24. </Route>
  25.  
  26. </Router>
  27. );
  28. }
  29. }
  30.  
  31. export default App;

Report this snippet  

You need to login to post a comment.