Subscribe on changes!

Components rendered in place of a slot within keep-alive are re-rendered when shown

avatar
Dec 16th 2021

Version

3.2.26

Reproduction link

codesandbox.io

Steps to reproduce

  • Open the console
  • Click on the "toggle" button twice, or more

What is expected?

  • Initial mount console statements are displayed and nothing else

What is actually happening?

  • Each time the component that is within 'KeepAliveComponent' is shown, it prints a mount statement

This was not happening in vue2, cf: https://codesandbox.io/s/hopeful-dawn-2vke8?file=/src/App.vue

Please note that a workaround is to pass the component to be rendered instead of a slot with component is="xxx", but this is far from ideal as the component that holds the 'keep-alive' has to depend directly on all the components it is supposed to be able to display.

avatar
Dec 16th 2021

I would say this is more correct since the component is rendered by a parent element that is not kept alive. It's like the need of using it with the v-slot syntax in vue-router