title: React fetch by route
body: <p>I have page on route /journal/:id and then I want to fetch data from api with that 'id'. I add fetch to componentDidMount but page don't change if I already on page from route /journal/:id and use  from that page to other /journal/:id.</p>
  
  <p>Seems that it exists other way to do that. Please help.</p>
  
  <p>here is code:</p>
  
  <pre><code>//router page
  &lt;Route component={ListLayout}&gt;
        &lt;Route path="/journals" component={Journals} /&gt;
        &lt;Route path="/journal/:id" component={Journal} /&gt;
        &lt;Route path="/shelves" component={Shelves} /&gt;
  &lt;/Route&gt;
  
  
  export default class Journal extends Component {
  
  
  
      state = {
          reader: false,
          journal: {}
        }
  
        componentWillMount(){
          const myHeaders = new Headers();
  
          myHeaders.append('X-User-Agent', '84e6f2c45955b65b');
  
          const myInit = { method: 'GET',
                         headers: myHeaders//,
                         //mode: 'cors',
                         //cache: 'default'
                       };
  
          const myRequest = new Request(`/issues/${this.props.location.pathname.split('/').pop()}`,
          myInit);
          fetch(myRequest)
            .then(response =&gt; {
              return response.json();
             })
            .then(data =&gt; {
              console.log(data);
              this.setState({journal: data.data});
            })
            .catch( console.log );
        }
      render() {
          let { journal } = this.state;
      &lt;div className="JournalPage__Title"&gt;{journal.magazine_title}&lt;/div&gt;
                    &lt;div className="JournalPage__Description"&gt;{journal.description}&lt;/div&gt;
      &lt;Link to="/journal/432"&gt;Test fetch&lt;/Link&gt;
      }
  
  }
  </code></pre>