React-router V4, URL Changing But Component Doesn't Render

I've tried everything but fail to render component when URL changes. No error messages nothing, react-redux is installed but not using it yet, so it can't be the problem. When I ch

Solution 1:

I assume that you need to put your Route components directly into Switch and don't forget to render children in Layout. So try this:

app.js:

class App extends Component {
  render() {

  return (
  <div>
    <BrowserRouter>
      <Layout>
        <Switch>
          <Route path="/auth" component={Auth} />
          <Route path="/" exact component={SearchBox} />
        </Switch>
      </Layout>
    </BrowserRouter>
    </div>
    );
  }
}

Layout.js

render() {
  // ...

  return (
    <div>
      <NavBar />
      { this.props.children } // <-- your route specific components
    </div>
  )
}