title: How to route to a path with parameters in React.js
body: <p>I'm trying to make a news-feed website with React.js.</p>
  <p>How to make a Router with the news ID?
  I'm trying something like this:</p>
  <pre><code>&lt;Route path=&quot;/news/:id&quot;&gt;
     { ( {id} ) =&gt; &lt;NewsPiece newsID={id}/&gt; }
  &lt;/Route&gt;
  </code></pre>
  <p>But it didn't work out. I tried to look it up but didn't find any way convenience.</p>
  <p>Below is my App.js being the main file.</p>
  <pre><code>import React from 'react';
  import NavBar from './components/NavBar'
  import Container from './components/Container'
  import NewsPiece from './components/NewsPiece'
  import Topics from './components/Topics'
  import {
    BrowserRouter as Router,
    Switch,
    Route,
  } from &quot;react-router-dom&quot;;
  
  function App() {
    return (
      &lt;React.Fragment&gt;
        &lt;NavBar/&gt;
        &lt;Router&gt;
          &lt;Switch&gt;
  
            &lt;Route path=&quot;/news/:id&quot;&gt;
              { ( {id} ) =&gt; &lt;NewsPiece newsID={id}/&gt; }
            &lt;/Route&gt;
  
            &lt;Route path=&quot;/news&quot;&gt;
              &lt;Topics/&gt;
            &lt;/Route&gt;
  
            &lt;Route path=&quot;/&quot;&gt;
              &lt;Container/&gt;
            &lt;/Route&gt;
  
          &lt;/Switch&gt;
        &lt;/Router&gt;
      &lt;/React.Fragment&gt;
    );
  }
  
  export default App;
  </code></pre>