Subscribe on changes!

keep-alive about dynamic component

avatar
Jul 4th 2022

Vue version

3.2.25

Link to minimal reproduction

none

Steps to reproduce

1、display YkddcDI1bi 2、code include is component name key bind component id

  <router-view v-slot="{ Component, route }" >
    {{route.query.id}}
    <keep-alive :include="includes">
      <component :is="Component" :key="route.query.id"></component>
    </keep-alive>
  </router-view>

3、add Component

const helloWorlds = ref([
  { name: 'world-1', id: 1},
  { name: 'world-2', id: 2},
])
const addWorld = () => {
  const len = helloWorlds.value.length + 1
  helloWorlds.value.push({
    name: `world${len}`,
    id: len
  })
}

What is expected?

i want cache is empty when adding new component

What is actually happening?

cache is exist when adding new component

System Info

No response

Any additional comments?

No response

avatar
Jul 4th 2022

please provide a reproduction link