Drop
Drop

Reputation: 1582

Duplicate paths in react-route

In heder there is a component with live search in which there are links for the found film or TV series depending on what came from the server.

Use react-route v4

urlRusLat - just a function that returns translate name a movie

<div>
  <Helmet>
    <title>Movie-search</title>
  </Helmet>
  <Nav/>
  <Header/>

  <Switch>
    <Route exact path="/" component={Main} />
    <Route exact path="/movie/:urlRusLat" component={Movie} />
  </Switch>
</div>

and link in the search result

<Link to={item.media_type + '/' + urlRusLat(item.title || item.name) + '-' + item.id} className="result-element" key={index}>

and when I'm on the page of the movie and choose something from the search, then my path becoming like this

/movie/some-movie/movie/some-movie

how do that, when I click on the link in /move/some-movie

/movie/some-movie

how not to duplicate paths?

Upvotes: 6

Views: 3820

Answers (2)

Alfrex92
Alfrex92

Reputation: 6778

Just don't forget to add the / add the beginning of the route

 <NavLink activeClassName="activePage" to="/something/new/">Create Participants</NavLink>

Upvotes: 4

Slawa Eremin
Slawa Eremin

Reputation: 5415

Try this code:

<Link to={'/' + item.media_type + '/' + urlRusLat(item.title || item.name) + '-' + item.id} className="result-element" key={index}>

Upvotes: 2

Related Questions