vue3使用is动态切换组件报错Vue received a Component which was made a reactive object.

_处女座程序员的日常

于 2024-05-01 10:24:26 发布

阅读量517

点赞数 2

分类专栏： js 前端 vue 文章标签： vue.js javascript ecmascript

本文链接：https://blog.youkuaiyun.com/qq_42931285/article/details/138367826

版权

vue3使用is动态切换组件，activeComponent用ref定义报错
Vue received a Component which was made a reactive object. This can lead to unnecessary performance overhead, and should be avoided by marking the component with markRaw or using shallowRef instead of ref

在这里插入图片描述

我们需要使用 shallowRef 替代 ref 来避免报错。shallowRef 创建的引用不会将组件标记为响应式对象，从而避免了潜在的性能开销。

<button @click="switchComponent('componentA')">Component A</button>
<button @click="switchComponent('componentB')">Component B<

最低0.47元/天解锁文章