loading...

Discussion on: Creating 404 page in react using React Router

Collapse
vincevegas profile image
vince vegas

Why the 404 page appearing to blog & contact router?

<BrowserRouter>

<Switch>
  <Route exact path="/" component={Home} />
  <Route exact path="/about" component={About} />
  <Route component={NotFoundPage} />
</Switch>

<Switch>
  <Route exact path="/blog" component={Blog} />
  <Route exact path="/contact" component={Contact} />
</Switch>

</BrowserRouter>
Collapse
paramharrison profile image
Paramanantham Harrison Author

Because you have two switch statement, the router checks the first switch and loads the default not found route

Collapse
vincevegas profile image
vince vegas

Also this, why the Blog & Contact doesn't appear, is there any way to have multiple providers in Routes

 <Switch>
  <AProvider>
        <Route exact path="/" component={Home} />
        <Route exact path="/about" component={About} />
  </AProvider>

   <BProvider>
        <Route exact path="/blog" component={Blog} />
        <Route exact path="/contact" component={Contact} />
        <Route component={NotPage} />
    </BProvider>
</Switch>