fix(keep-alive): avoid duplicate mounts of deactivate components
try to fix #12017 also fix https://github.com/vuejs/router/issues/626
Size Report
Bundles
| File | Size | Gzip | Brotli |
|---|---|---|---|
| runtime-dom.global.prod.js | 100 kB (+301 B) | 38.1 kB (+113 B) | 34.3 kB (+83 B) |
| vue.global.prod.js | 158 kB (+301 B) | 57.9 kB (+94 B) | 51.6 kB (+93 B) |
Usages
| Name | Size | Gzip | Brotli |
|---|---|---|---|
| createApp (CAPI only) | 46.6 kB (+203 B) | 18.3 kB (+73 B) | 16.7 kB (+64 B) |
| createApp | 54.5 kB (+203 B) | 21.2 kB (+65 B) | 19.4 kB (+72 B) |
| createSSRApp | 58.8 kB (+203 B) | 23 kB (+64 B) | 20.9 kB (+65 B) |
| defineCustomElement | 59.4 kB (+203 B) | 22.8 kB (+80 B) | 20.8 kB (+47 B) |
| overall | 68.7 kB (+301 B) | 26.4 kB (+106 B) | 24.1 kB (+99 B) |
@vue/compiler-core
npm i https://pkg.pr.new/@vue/compiler-core@12042
@vue/compiler-ssr
npm i https://pkg.pr.new/@vue/compiler-ssr@12042
@vue/compiler-dom
npm i https://pkg.pr.new/@vue/compiler-dom@12042
@vue/compiler-sfc
npm i https://pkg.pr.new/@vue/compiler-sfc@12042
@vue/reactivity
npm i https://pkg.pr.new/@vue/reactivity@12042
@vue/runtime-core
npm i https://pkg.pr.new/@vue/runtime-core@12042
@vue/runtime-dom
npm i https://pkg.pr.new/@vue/runtime-dom@12042
@vue/server-renderer
npm i https://pkg.pr.new/@vue/server-renderer@12042
@vue/shared
npm i https://pkg.pr.new/@vue/shared@12042
vue
npm i https://pkg.pr.new/vue@12042
@vue/compat
npm i https://pkg.pr.new/@vue/compat@12042
commit: 436296c
I tested the preview package(pnpm add https://pkg.pr.new/vue@12042) of this PR in the reproduction of #12017.
The b.vue is still mounted twice.
It seems that only the examples in the playground have been fixed, I thought they were the same issue
/ecosystem-ci run
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :x: failure | :x: failure |
| nuxt | :white_check_mark: success | :white_check_mark: success |
| pinia | :white_check_mark: success | :white_check_mark: success |
| primevue | :white_check_mark: success | :white_check_mark: success |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :x: failure | :x: failure |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :x: failure |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
kind of strange, doesn't seem to have much relevance, might need to merge the master branch 😄
/ecosystem-ci run
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :white_check_mark: success | :white_check_mark: success |
| nuxt | :white_check_mark: success | :white_check_mark: success |
| pinia | :white_check_mark: success | :white_check_mark: success |
| primevue | :white_check_mark: success | :white_check_mark: success |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :x: failure | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :x: failure | :white_check_mark: success |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
/ecosystem-ci run
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :white_check_mark: success | :white_check_mark: success |
| nuxt | :x: failure | :white_check_mark: success |
| pinia | :white_check_mark: success | :white_check_mark: success |
| primevue | :white_check_mark: success | :white_check_mark: success |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :x: failure | :white_check_mark: success |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
@yangxiuxiu1115 I've made some minor tweaks, see https://github.com/vuejs/core/pull/12042/commits/436296c5f1b20c17ba94fd9ce04c7f78f38d52eb
fcee32616a14fafc29841f643ee1f169989dbbef might be more appropriate, being able to omit some of the loops, though it might need some tweaking(which probably won't have much of an impact on performance, maybe it's not necessary?)
@yangxiuxiu1115 I tested https://github.com/vuejs/core/commit/fcee32616a14fafc29841f643ee1f169989dbbef with #12017's reproduction and it's not correct. Although the test case of this PR passed, #12017 is still not working as expected. Perhaps the current test cases do not fully match the reproduction of #12017. so I reverted it.
This is the solution to the problem - https://github.com/vuejs/router/issues/626. Which is also a bug in my project when mounting keep-alive children. After all this time it still hasn't been approved?
This is the solution to the problem - vuejs/router#626. Which is also a bug in my project when mounting keep-alive children. After all this time it still hasn't been approved? @yangxiuxiu1115, @edison1105, Any ideas how this solution can be promoted to the main branch?