how can React get the route parameters

React can utilize the react-router library to fetch route parameters. Here are the steps to retrieve route parameters using react-router.

1. The react-router-dom library allows you to manage your app’s routes in a React application.

npm install react-router-dom

1. an object that creates routing for a web application
2. Path

import React from 'react';
import { BrowserRouter as Router, Route } from 'react-router-dom';

import Home from './Home';
import Product from './Product';

const App = () => {
  return (
    <Router>
      <Route exact path="/" component={Home} />
      <Route path="/product/:id" component={Product} />
    </Router>
  );
}

export default App;

1. props – short for properties or proper credit, often used in the entertainment industry to refer to objects or items used during a performance or production.
2. parameters of the match
3. Item
4. I need identification.

import React from 'react';

const Product = (props) => {
  const { id } = props.match.params;

  return <h1>Product ID: {id}</h1>;
}

export default Product;

In the example above, when accessing /product/123, the Product component will be rendered with the value of the id parameter as 123.