React Router change the link but can't changed the body

React router Link tag wokred in the first page and page also changed but in the 2nd page have many link If i click on this link it can changed the link but not body how can i fix it... Router code :

            <Switch>
          <Route exact strict path="/">
            <Home />
          </Route>
          <Route exact strict path="/about/">
            <About />
          </Route>
          <Route exact strict path="/channel/:title" component={withRouter(Dashboard)} />
        </Switch>
      </div>
    </Router>

2nd page code

   function Dashboard() {
const { title } = useParams();
return (
   <div>
     <Play 
     title={title}
     />
   </div>
 );
}

Passing some data via props

//this is <Play/> component code just showing here shortly
<Router>
<VideoPlayer
      controls={true}
      src={this.state.link}
      poster={this.state.poster}
      width={window.screen.width}
      height={window.screen.height - (window.screen.width+100)}
    />
  <Link to="/channel/Rtv">Rtv</Link>
      </div>
      </Router>

just showing a little part of this code... please help me ...how can i fix the error

Full code is here: https://gist.github.com/fahadali32/8643d33a2328c1375552e4ba7637fc92

Ok i find the answer just simply add

<div key={this.props.link}>
<VideoPlayer controls={true} src={this.state.link} poster={this.state.poster} width={window.screen.width} height={window.screen.height - (window.screen.width+100)} />
</div>