Skip to content

Unmounting a parent component fails when KeepAlive is used inside a v-for with non-reactive array #14116

@sirxemic

Description

@sirxemic

Vue version

3.5.24

Link to minimal reproduction

https://play.vuejs.org/#eNqNU01vnDAQ/SuWL7uRtrBse6IsUlrl0FZqqza3ugcKw64TYyPbkK0Q/z1jzEc+V7nheTNv3sw8OnpZ10HbAI1pYnLNa0sM2KZOmeRVrbQln1VVR6TUqiKrIBxermD1cc7oiIaS9GOOw5hkMlfSINlR3XmGvctaW93AhYOxyzWvQDV2vb4g+5R0TJIlPWgz0QAWlZkwwGS/IdF2u8XSJPQ6USE+LFS1yCzgi5DEd2rf8XLP6MzFKAk9XvAWUUDGtFTqX6aTEEOIJeEDIrqh1qD8kh+CG6Mk7mYQx2iOdFyA/lFbjuMxGnvZDsuEUHdfh5gbcjPF8yPkty/Eb8zJxRj9qcGAboHRGbOZPoD18NXv73DC7xmsVNEIzD4D/gKjROM0+rRPjSxQ9oO8Qe2X4X5cHq7N1cmCNNNQTqjL7Id8RvGmbpOvjb7IfR98GOrwYLjF2Szn3bV75K7d4K7JPxzvYtAGfxxtR3gRk2hDZFZBTFYWjI1Wrtvf877wR3Zik2OUouWjJMSPMbSg+PgGUF8K3gIapVQafeQkEC69FPRSfAv/x3DAC0bn2tGAu7RDoa6o7xM/0kIfzvxT99GBy9dTL85LebbFN45shLLTH/Bij/4elFpRJQ==

Steps to reproduce

Check the playground example and observe that an error appears:

parentComponent.ctx.deactivate is not a function

What is expected?

Instead of an error, it should be switching to a view that says "foobar".

It shouldn't matter whether items is reactive or not.

What is actually happening?

An error breaks the app when App.vue attempts to unmount the Comp1 component:

parentComponent.ctx.deactivate is not a function

Wrapping the value of items in Comp1.vue with reactive(...) fixes it.

System Info

System:
    OS: Windows 11 10.0.26100
    CPU: (16) x64 AMD Ryzen 7 3700X 8-Core Processor
    Memory: 11.80 GB / 31.92 GB
  Binaries:
    Node: 22.13.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.9.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 142.0.7444.163
    Edge: Chromium (141.0.3537.85)
    Firefox: 145.0 - C:\Program Files\Mozilla Firefox\firefox.exe
    Internet Explorer: 11.0.26100.1882
  npmPackages:
    vue: latest => 3.5.24

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions