title: Catch Data from URL params in react class Compoent
body: <p>First of all I like to convey thanks all the wise programmer. After updating react react-router-dom i am facing this problem. Here i want to mention one thing that, i am a &quot;class component&quot; lover.</p>
  <p><strong>However, This is my base component in react.</strong></p>
  <pre><code>import React, { Fragment, Component } from 'react'
  import axios from 'axios'
  import { Col , Row} from 'react-bootstrap'
  import { Link } from 'react-router-dom'
  
  export default class Blog extends Component {
      constructor(props) {
          super(props)
          this.state = {
               data:[]
          }
      }
      componentDidMount()
      {
          axios.get(&quot;https://jsonplaceholder.typicode.com/posts&quot;)
          .then((response)=&gt;{
              if(response.status===200)
              {
                  this.setState({
                      data:response.data
                  })
              }
          })
          .catch((error)=&gt;{})
      }
      
      render() {
          
          const allData = this.state.data;
          const blogFull = allData.map((val)=&gt;{
              var title = val.title;
              var body = val.body;
              var id = val.id;
              return(
                  &lt;Col key={id} lg={4}&gt;        
                      &lt;Link to={&quot;/post/&quot;+id}&gt;&lt;h1&gt;{title}&lt;/h1&gt;&lt;/Link&gt;
                          &lt;p&gt;{body}&lt;/p&gt;
                  &lt;/Col&gt;
              )
          })
          return (
              &lt;Fragment&gt;
                  &lt;Row&gt;
                  {blogFull}
                  &lt;/Row&gt;
              &lt;/Fragment&gt;
          )
      }
  }
  </code></pre>
  <p><strong>and this is my next component</strong></p>
  <pre><code>import axios from 'axios'
  import React, { Component, Fragment } from 'react'
  import { useParams } from 'react-router'
  
  export default class Post extends Component {
      constructor(props) {
          super(props)
      
          this.state = {
              
              mydata:[],
          }
      }
  
      componentDidMount()
      {
          axios.get(&quot;https://jsonplaceholder.typicode.com/posts/&quot;)
          .then((response)=&gt;{
              if(response.status===200)
              {
                  this.setState({
                      mydata:response.data
                  })
              }
          })
          .catch((error)=&gt;{
  
          })
      }
      
      render() {
          const dataAll = this.state.mydata;
  
          return (
              &lt;Fragment&gt;
              data retriving
                  &lt;h1&gt;{dataAll.title}&lt;/h1&gt;
                  &lt;p&gt;{dataAll.body}&lt;/p&gt;
              &lt;/Fragment&gt;
          )
      }
  }
  </code></pre>
  <p><strong>My Route is here :</strong></p>
  <pre><code>&lt;Routes&gt;
  &lt;Route exact path=&quot;/&quot; element={&lt;Blog/&gt;}/&gt;
  &lt;Route exact path=&quot;/post/:id&quot; element={&lt;Post/&gt;}/&gt;
  &lt;/Routes&gt;
  </code></pre>
  <p>Can anyone tell me that how can i get data in post component from base component via its url parameter? The &quot;match&quot; object is not working in current update of react-router-dom. I want help for class component.</p>