ionic-team / ionic-team/ionic-framework

bug: Route match params not readable in lifecycle hooks in Ionic React

Aperta
#21,594 22 commenti 8 reazioni 0 assegnatari Vedi su GitHub
package: react type: bug
Lingua principale
TypeScript
Stelle
52.7k
Fork
13.3k
Merge medio
1g 15h
PR unite (30g)
51

Descrizione

It seems that the route match params do not get updated in the Ionic-React lifecycle hooks.

**Ionic version:**
[ ] **4.x**
[x] **5.x**.
@ionic/react: 5.2.2

**Current behavior:**
When a route is visited again, Ionic reuses the existing page.
This is a bit different from how React does it, but as described in the [docs](https://ionicframework.com/docs/react/lifecycle) there are handy lifecycle hooks available to help with it.

However the route match params don't seem to update.

**Expected behavior:**
I would expect that the match params are updated.

**Steps to reproduce:**

Some pseudo-code to show the issue:
```








```

```

interface GameProps
extends RouteComponentProps<{
id: string
}> {}

const GamePage: React.FC = ({ match }) => {

useIonViewDidEnter(() => {
console.log('useIonViewDidEnter ', match.params.id) // always the initial id
})
useEffect(() =>
console.log('useEffect', match.params.id) // always the current id
})
return { match.params.id }

```

In another part of the app:
```
history.push('/game/10');
```
and later
```
history.push('/game/11');
```
But
```
console.log('useIonViewDidEnter ', match.params.id) // always the initial id
```
keeps outputting 10 (the first)

**Related code:**
If needed I can create a sample project.

**Ionic info:**

```

Ionic:

Ionic CLI : 6.10.1
Ionic Framework : @ionic/react 5.2.2

Capacitor:

Capacitor CLI : 2.2.0
@capacitor/core : 2.2.0

Utility:

cordova-res (update available: 0.15.0) : 0.14.1
native-run : 1.0.0

System:

NodeJS : v14.3.0
npm : 6.14.5
OS : macOS Catalina

```

Guida per i contributori

Apri la guida per i contributori

Valutazione

Questa issue non è ancora stata valutata.

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.