Mendi Sterenfeld
Mendi Sterenfeld

Reputation: 397

React Router DOM is rendering 2 components

This is my router structure:

<Router>
      <main className="py-3">
        <Switch>
          <Container>
            <Route exact path="/admin" component={AdminScreen}></Route>

            <Route path="/:campaignId" component={CampaignScreen}></Route>
            <Route path="/" component={HomeScreen} exact></Route>
          </Container>
        </Switch>
      </main>
    </Router>

For "some" reason, when I go to /admin i also get the CampaignScreen rendered.

I added the <Switch> as you can see, but it does not seem to help. Where lies the problem?

Upvotes: 0

Views: 30

Answers (1)

Shmili Breuer
Shmili Breuer

Reputation: 4147

Since admin can theoretically also be a campaignId react router thinks it matches both routes, and you have the <Container> element directly inside the Switch it still renders both, the solution is to have your routes directly in the Switch

Upvotes: 1

Related Questions