title: React router open modal
body: <p>I'm new to react and redux world. I have a question regarding react router. Following is my App component.</p>
  
  <pre><code>class App extends React.PureComponent {
    render() {
      return (
        &lt;div&gt;
          &lt;Switch&gt;
            &lt;Route exact path="/" component={HomePage} /&gt;
            &lt;Route exact path="/callback" component={CallbackPage} /&gt;
            &lt;Route exact path="/list" component={List} /&gt;
            &lt;Route component={NotFoundPage} /&gt;
          &lt;/Switch&gt;
        &lt;/div&gt;
      );
    }
  }
  export default App;
  </code></pre>
  
  <p>My list class looks like this:</p>
  
  <pre><code>export class List extends React.PureComponent {
    constructor(props) {
      super(props);
  
      this.state = {
        isOpen: false,
      };
  
      this.depositHandleToggle = this.depositHandleToggle.bind(this);
    }
    depositHandleToggle = () =&gt; {
      this.props.dispatch(push(`${this.props.match.url}/deposit`));
    }
    render() {
      const { match } = this.props;
      return (
        &lt;div&gt;
        &lt;Route path={`${match.url}/deposit`} component={Modal} /&gt;
          &lt;button onClick={this.depositHandleToggle}&gt;Open Modal&lt;/button&gt;  
        &lt;/div&gt;
      );
    }
  }
  export default List;
  </code></pre>
  
  <p>So my question is: when i click the button in List container, why my router can't find this url 'localhost:xxx/list/deposit'? it renders the App component but it never goes back to List component. Is it possible to have the custom routes inside my list container? Am i doing something wrong? Please someone help me with this.</p>
  
  <p>I hope you understand my question. Thanks in advance. </p>
  
  <p><strong>ANSWER:</strong></p>
  
  <p>I found the answer, the issue was in my App component list route. I was having the <em>'exact'</em> keyword, that's why route inside my list component was not working. Following way is the correct way. </p>
  
  <pre><code>&lt;Route path="/list" component={List} /&gt;
  </code></pre>
  
  <p>I hope this will help someone.</p>