1import React from 'react'
2import ReactDOM from 'react-dom'
3import { useParams } from 'react-router-dom'
4
5function BlogPost() {
6 // We can call useParams() here to get the params,
7 // or in any child element as well!
8 let { slug } = useParams()
9 // ...
10}
11
12ReactDOM.render(
13 <Router>
14 <div>
15 <Switch>
16 {/* No weird props here, just use
17 regular `children` elements! */}
18 <Route path="/posts/:slug">
19 <BlogPost />
20 </Route>
21 </Switch>
22 </div>
23 </Router>,
24 document.getElementById('root')
25)
1import { useLocation } from 'react-router-dom'
2
3// Location is, for example: http://localhost:3000/users/new
4
5// Care! MyComponent must be inside Router to work
6const MyComponent = () => {
7 const location = useLocation()
8
9 // location.pathname is '/users/new'
10 return <span>Path is: {location.pathname}</span>
11}
12
13export default MyComponent