search

vuejs / vue-router

🚦 The official router for Vue 2
http://v3.router.vuejs.org/
MIT License
18.99k stars 5.06k forks source link

Bug with transition + keep-alive + nested router-view #3829

Closed TheTrigger closed 1 year ago

TheTrigger commented 1 year ago

Version

3.6.5

Reproduction link

github.com

Steps to reproduce

  1. Start the page to / (Home)
  2. Click on User Edit
  3. Click on Home
  4. Click on User Dashboard

What is expected?

Expecting to see the User Dashboard page

What is actually happening?

The main router-view shows the latest sub-routing: User Edit.

The relevant thing I tried is to put the attribute :key to the main router-view

<router-view :key="`app_${$route.fullPath}}`"></router-view>

alto tried to combine with

<router-view :key="`user_${$route.fullPath}}`"></router-view>

but by doing this you mysteriously lose the animation on the child routing-view maybe because the parent-routing-view is being reloaded.

If you remove the node <transition> or <keep-alive> it start to work as expected.

I tried many things but haven't found a way to make it work with transition, keep-alive and nested routing

thanks

posva commented 1 year ago

Hi, thanks for your interest but Github issues are for boiled down bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.