React Router не обновляет компонент

Question

Я получил компонент, который должен отображать GIF-файлы из giphy в поисковом запросе по маршруту:

public render(){
    return(
        <div>
            <Router>
                <div>
                    <Route path='/:term' component={this.dispGiphy}  />
                </div>
            </Router>
        </div>
    )        
} 

 private readonly dispGiphy = (props) => {
    this.getGifs(props.match.params.term)
    return(
    this.state.items.map(data => (
        <img className="images" src={data.images.downsized.url} />
    )))
 }

public getGifs(inputValue){ 
    // Get Request to the API and write the result to this.state.items
    fetch("https://api.giphy.com/v1/gifs/search?limit=3&api_key=KEY_GOES_HERE&q=" + inputValue)
          .then(res => res.json())
          .then(
              (result) => {
                  this.setState({
                      isLoaded: true,
                      items: result.data
                  });
              },
              (error) => {
                  this.setState({
                      error,
                      isLoaded: true
                  });
              }
          )
  }

Я также получил список, в котором перечислены предыдущие условия поиска:

 public render(){
    return(
        <div>
        <ul id="ul_LeftList">
        {this.state.terms.map((term) => (
           <li key={term}>
          <Link to={`${term}`}>{term} </Link><button className="fa fa-cancel btnDelete" onClick={this.deleteElement(term)}
        >X</button>
         </li>
        ))}
    </ul>
    </div>
    )
}

Эти два компонента связаны в app.tsx

return(
    <div>
        <div><header className="App-header">
     <input type="text" placeholder="Search..." onChange={this.searchChanged} />   
     <button type="submit" className="fa fa-search searchButton"  onClick={this.process} />
   </header>
   </div>
   <Router>
   <p className="leftList">
        <LeftList terms={this.state.searchterms} />
        </p>
    </Router>
        <p className="App-content">
        <Router>
        <Route path='/:term' component={Giphy}  />
        </Router>
        <Giphy />
        </p>

    </div>
)

Теперь, когда я нажимаю на ссылку в левом списке, я ожидаю две вещи: 1. Маршрут будет обновлен поисковым запросом, который я только что нажал (работает) 2. Компонент Giphy показывает новые GIF-файлы, относящиеся к поисковому запросу на маршруте (не работает)

На самом деле я не знаю, в чем проблема.