Alexander
Alexander

Reputation: 1378

React router is stacking routes

I'm trying again:

I'm using props.history.push('/something') from a route '/test'

but then I'm redirected to '/test/something' instead of '/something' how can I make it happen?

my example cant work with <Route> <Redirect> <Route> because I'm passing props with my router, for example '/something/:id' any ideas?

EDIT:

  <Route
            exact
            path="/search/:id"
            render={(props) => <SearchResults />}
          />

when I use onclick function like so:

const onSubmit = () => {
    props.history.push(`search/${id}`)
  }

I get pushed to search/search/:id instead of search/:id ( I have the search button always present in all my components) any ideas?

Upvotes: 0

Views: 56

Answers (1)

Shubham Khatri
Shubham Khatri

Reputation: 281646

Since you do not add a prefix / to your history.push method, it redirects you to the route relative to the current route i.e if your current route /search, props.history.push(/search/${id}) will take you to /search/search/:id

Adding a prefix / will fix your issue. since it tells the history to add an absolute route

const onSubmit = () => {
    props.history.push(`/search/${id}`)
  }

Upvotes: 1

Related Questions