Params doesn't show up when navigating to route but shows up when loading the page directly?

Ionic Framework Ionic React
1

I have used both useParams approach from react-router-dom and also the RouteComponentProps.

But the params doesn’t show up when I navigate to the page but when I reload of the page or got the page directly in the browser then it shows up .

2

could you introduce some code, or maybe the project?

3

App.tsx

<IonReactRouter>
      <IonRouterOutlet>
        <Route render={() => <Redirect to="/" />} />
        <Route exact path="/channel" render={() => <Redirect to="/messages" />} />
        <Route exact path="/channel/:cid" render={props => <Channel {...props} />} />
     <IonRouterOutlet>
</IonReactRouter>

the params does n’t show up when I navigate from IonItem routerLink click … but it shows up when I load the page directly throught the browser.

4

I had a similar problem with useHistory, I solved this by putting my routes like this, try it and tell me, as you can see, the props are no longer passed, so what you need in your components regarding navigation, use hooks

<IonReactRouter>
      <IonRouterOutlet>
        <Route exact path="/channel">
            <Redirect to="/messages" />
        </Route>
        <Route exact path="/channel/:cid">
            <Channel/>
        </Route>
        <Route>
            <Redirect to="/" />
        </Route>
     <IonRouterOutlet>
</IonReactRouter>

Be careful with the Route without path, if you put it first it will redirect everything to / (I’m not very sure), if you put it last, all the routes that you do not declare will go there.