You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
842 B
41 lines
842 B
import React from "react"; |
|
import { Route, Link } from "react-router-dom"; |
|
import { Container } from "semantic-ui-react"; |
|
|
|
const Topics = ({ match }) => ( |
|
<Container> |
|
<h2>Topics</h2> |
|
<ul> |
|
<li> |
|
<Link to={`${match.url}/rendering`}> |
|
Rendering with React |
|
</Link> |
|
</li> |
|
<li> |
|
<Link to={`${match.url}/components`}> |
|
Components |
|
</Link> |
|
</li> |
|
<li> |
|
<Link to={`${match.url}/props-v-state`}> |
|
Props v. State |
|
</Link> |
|
</li> |
|
</ul> |
|
|
|
<Route path={`${match.url}/:topicId`} component={Topic} /> |
|
<Route |
|
exact |
|
path={match.url} |
|
render={() => <h3>Please select a topic.</h3>} |
|
/> |
|
</Container> |
|
); |
|
|
|
const Topic = ({ match }) => ( |
|
<div> |
|
<h3>{match.params.topicId}</h3> |
|
</div> |
|
); |
|
|
|
export default Topics;
|
|
|