ionic-team / ionic-team/ionic-framework

bug: vue, root direction does not unmount wiped views

Aperta
#27,191 10 commenti 3 reazioni 0 assegnatari Vedi su GitHub
package: vue type: bug
Lingua principale
TypeScript
Stelle
52.7k
Fork
13.3k
Merge medio
1g 15h
PR unite (30g)
51

Descrizione

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v6.x

### Current Behavior

Navigating forward mode with at least 3 forward navigation and then triggering root navigation after the third or more forwarded route does not clean up the mapping of the IonRouterOutlet components completely but only removes 1 Component from the stack and pushes the root element.

### Expected Behavior

The expected behavior is that the IonRouterOutlet should reset the stack and start from scratch if the direction is root but it does not you can see the screenshots of stacks created in the Steps to Reproduce.

### Steps to Reproduce

Here are step by step for current behavior with VueDev Tool screenshots

## The initial state starting at DashboardView

![image](https://user-images.githubusercontent.com/10531584/231722878-9e055a63-e59d-40f4-95fb-e77f8f76f971.png)

## Root Navigation to ForumsView
![image](https://user-images.githubusercontent.com/10531584/231723185-3d5d27d0-8ace-41c0-b233-25355db01796.png)

## Forward Navigation to TopicView
* The topic view is now a stacked view in the IonRouterOutlet
![image](https://user-images.githubusercontent.com/10531584/231723350-cd845ac0-fbde-4bc6-83a1-49b246d6abdf.png)

## Another Forward Push to ThreadView
* Third stacking done
![image](https://user-images.githubusercontent.com/10531584/231723618-407b1b33-e550-4ed3-97b9-5559a2de99ad.png)

## Final Redirection to Dashboard using root as router-direction
* Side Note: I have also tried replace through vue router ($router), ionRouter instance navigate function using useIonRouter but with no success

![image](https://user-images.githubusercontent.com/10531584/231724429-df17bead-1b2a-4599-8a38-fda5a033a5aa.png)

### Code Reproduction URL

https://stackblitz.com/edit/vitejs-vite-yj2kdn?file=src/components/HelloWorld.vue

### Ionic Info

```
Ionic:

Ionic CLI : 6.20.4 (/home/maxgaurav/.nvm/versions/node/v18.3.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/vue 6.4.1

Capacitor:

Capacitor CLI : 4.5.0
@capacitor/android : 4.5.0
@capacitor/core : 4.5.0
@capacitor/ios : 4.5.0

Utility:

cordova-res : not installed globally
native-run (update available: 1.7.2) : 1.6.0

System:

NodeJS : v18.3.0 (/home/maxgaurav/.nvm/versions/node/v18.3.0/bin/node)
npm : 9.1.2
OS : Linux 5.15

────────────────────────────────────────────────

Ionic CLI update available: 6.20.4 → 7.0.0
Run npm i -g @ionic/cli to update

────────────────────────────────────────────────
```

### Additional Information

In the IonRouterOutlet component implementation of vue package through debugging i see that action of call unmountLeaving views only being looped once.

I have added the links to the actions below.

https://github.com/ionic-team/ionic-framework/blob/114fe28f3cc9ee52bc5eefa569353f490ab01023/packages/vue-router/src/viewStacks.ts#L190

https://github.com/ionic-team/ionic-framework/blob/main/packages/vue/src/components/IonRouterOutlet.ts#L400

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.