I am learning useParams hook in react. I have a URL like this and need to be able to extract the letter 9 from it.
http://localhost:3010/9/solutionHow can I go about this ?
Best Answer
I'm assuming you're using react router, if you define a route like this for example:
<Route path="/:id/about"><About /></Route>Notice that you define the path with this :id notation, that means that the id will be the param in this specific case. Then you create a Link component
<Link to="/2/about">About</Link>And in your component that in this example is the about component you can use the hook like this:
function About() {const { id } = useParams();return (<div><h2>Now showing post {id}</h2></div>);}I have this code sandbox if you want to check the result https://codesandbox.io/s/react-router-basic-nv8pn
Assuming you are using react-router, then you should use Browser Router in your React app:https://reacttraining.com/react-router/web/api/BrowserRouter
and then declare a route like:
<Route path="/{id}/solution" component={Component} />and then in your Component you'll be able to use it:
const { id } = useParams();