keepAlive with Dynamic Components `setup` hmr error
Vue version
3.2.37
Link to minimal reproduction
https://github.com/yuntian001/keepAliveError
Steps to reproduce
- npm install
- npm run dev
- editor
src\components\HelloWorld.vue
const aa = ref('1234')
toconst aa = ref('hello')
What is expected?
no error
What is actually happening?
runtime-core.esm-bundler.js:38 [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core
at <KeepAlive>
at <RouterView>
at <App>
runtime-core.esm-bundler.js:6070 Uncaught (in promise) TypeError: parentComponent.ctx.deactivate is not a function
at unmount (runtime-core.esm-bundler.js:6070:33)
at patch (runtime-core.esm-bundler.js:5054:13)
at sharedContext.activate (runtime-core.esm-bundler.js:2435:13)
at processComponent (runtime-core.esm-bundler.js:5480:37)
at patch (runtime-core.esm-bundler.js:5085:21)
at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5695:17)
at ReactiveEffect.run (reactivity.esm-bundler.js:187:25)
at instance.update (runtime-core.esm-bundler.js:5729:56)
at callWithErrorHandling (runtime-core.esm-bundler.js:155:36)
at flushJobs (runtime-core.esm-bundler.js:388:17)
System Info
System:
OS: Windows 10 10.0.17763
CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz
Memory: 5.56 GB / 15.86 GB
Binaries:
Node: 16.15.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
npm: 8.5.0 - ~\AppData\Roaming\npm\npm.CMD
Browsers:
Internet Explorer: 11.0.17763.771
npmPackages:
vue: ^3.2.37 => 3.2.41
Any additional comments?
I saw this error mentioned, but it was closed. Please focus on it.
In this case, the shapeFlag
of the modified component is marked as COMPONENT_KEPT_ALIVE
because of the presence of the cache, causing the component not to be mounted:
I am trying to fix this issue.