title: How to re-load page on redirect React
body: <p>In my app I'm using React Router to add routes to my app. I'm redirecting to my home(feed) page from my AddAlbum class component using <code>withRouter</code> <code>history</code> once a user clicks save. My problem is my AddAlbum component is updating my home page so I need to re-load my home page once I redirect to see the changes made from my AddAlbum component. How would I accomplish this?</p>
  
  <p>Here is what my routes look like in my App.js Component:</p>
  
  <pre><code>import { BrowserRouter, Router, Route } from "react-router-dom";
  return (
      &lt;BrowserRouter&gt;
        &lt;div className="App"&gt;
        &lt;Router history={history}&gt;
        &lt;Route path="/album/create" component={AddAlbum}/&gt;
        &lt;Route exact path="/feed" component={Feed}/&gt;
        &lt;/Router&gt;
        &lt;/div&gt;
      &lt;/BrowserRouter&gt;
    );
  </code></pre>
  
  <p>Both AddAlbum and home(Feed) are class components.</p>
  
  <p>In my AddAlbum component I'm using <code>withRouter</code> and <code>history</code> in an onClick method to redirect. Here's the full function with the button (Redirect on the last <code>.then()</code>:)</p>
  
  <pre><code>this.onClick = this.onClick.bind(this);
  this.save2 = this.save2.bind(this);
  
  save2(event) {
    event.preventDefault();
    let user_id;
    let image;
    let data;
    const { history } = this.props;
  
    Promise.resolve().then(()=&gt;{
        user_id = this.context.user.sub;
        image = this.state.file;
        data = new FormData()
        data.append('file', this.state.file)
    }).then(()=&gt; { 
        this.setState(prevState =&gt; ({
        files: prevState.files.map((file, index) =&gt; ({...file, index})
    )}));
  
    let files = this.state.files;
     this.setState(prevState =&gt; ({
     albums: {...prevState.albums, files, user_id}
  }))
  
     Array.from(this.state.songsList).forEach(song =&gt; {
      data.append('songs', song)
    })
  
    data.append('albums', JSON.stringify(this.state.albums))
  
  
  }).then(()=&gt; {
      axios.post("http://localhost:3000/albums", data, { 
    }).then(res =&gt; { // then print response status
      console.log(res.statusText)
   })
  })
  .then(()=&gt; {
    const { match, location, history } = this.props;
    history.push('/feed');
  })
  .catch((err)=&gt; {console.log(err)});
  
  }
  
  onClick(event) {
    let albums = this.state.albums;
    if(albums.date  === "" || albums.title  === "" || albums.description === "") {
      alert("ERROR: Fields Must Be Filled In Before You Save");
      } else {
    this.save2(event);
    }
  }
  
  render() {
      return(
          &lt;ButtonToggle onClick={this.onClick} color="success"&gt;
              Save
          &lt;/ButtonToggle&gt; 
      )
  }
  </code></pre>
  
  <p>How would I re-load my home(Feed) component once I redirect to it?</p>