react route direct to the same route not updating

Question

So this is my situation:

I have App.jsx that renders this:

<BrowserRouter>
    <Switch>
        <Route path="/" exact component={MovieList} />
        <Route path="/search/:search" component={MovieList} />
    </Switch>
</BrowserRouter>

Now no matter if I'm on either one of these Routes, inside MovieList component there is a loop through list of Movie, and in each Movie there's a <Link /> to the same Route, for example:

<Link to="/search/goodmovie" />

The thing is, if I click on that link, nothing happens, and it happens because its on the same route, if for example I changed it to something else, <Link to="/blabla" /> it worked and redirected.

So how can I make it render again even if I want to link to the Route I'm currently in?

Edit: an example for a Movie component:

<div>
    <p class="text">{props.text}</p>
    <Link to="/search/test">Test link</Link>
</div>

Can you post more code snippets, specifically of your movie list component ? — Javoid, Apr 01 '20 at 01:01

Javoid · Answer 1 · 2020-04-01T01:41:42.913

0

Ok,

From what you've showed I am thinking your seeing "nothing" happen as your routing to the same component:

You need to change that component, or else what should be changing? I am sure your seeing that /search/test being appended to the URL at least correct?

Can you add

<Route path="/search/:search" component={Home} />

For example?

If I am missing the point here I apologize, please provide more info so I can continue to help if this didn't resolve your issue.

Edit: Looks like this post may contain the solution already:

Reload component via <Link> in React Router

edited Apr 01 '20 at 01:41

answered Apr 01 '20 at 01:20

Javoid

68
8

Yeah I can see the URL being changed correctly, but there is no update. and the logic behind redirect to the same Route: every Movie has categories, so you can do something like ``, but since It's in the same Route, it doesn't make the change. – Dorki Apr 01 '20 at 01:23
Well what are you expecting to update (As in what code should be firing, that isnt) ? Can you provide the code for that entire component, that will be useful I think. – Javoid Apr 01 '20 at 01:27
I want it to re-render, like if it wasn't reloaded in the first place. the entire component has hundreds of irrelevant lines for code, but even that simple example didn't work. – Dorki Apr 01 '20 at 01:38
1

Ah, I see. Okay please refer to this post: https://stackoverflow.com/questions/47792328/reload-component-via-link-in-react-router Your issue is that you need to pass a new state/props to this component to reload. You can use that state/props to display a category of your movie.. etc. – Javoid Apr 01 '20 at 01:40

react route direct to the same route not updating

1 Answers1