vue动态组件（Vue动态组件原理）

本篇文章给大家谈谈vue动态组件，以及Vue动态组件原理对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、Vue动态组件与传值
• 2、vue3动态组件为什么只能点击切换一次组件
• 3、[vue3进阶] 2.动态组件

Vue动态组件与传值

vue 动态组件 - 君非道

这里一句话就能完成动态组旦弊件，虽然感觉传值耐渗还不够完美（可能是有更好的方法，昌迟脊欢迎提出）。

如果没有，就只能通过v-if判断，会很累赘。

[img]

vue3动态组件为什么只能点击切换一次组件

Vue 收到一个组件，它被物雀蔽做成一个反应性对象。这可能会导致不必要的性能开销，应通过使用“markRaw”标记组罩州件岁贺或使用“shallowRef”而不是“ref”来避免。

[vue3进阶] 2.动态组件

之前我们用到一个组件的时候，在模板里写上组件的标签就余闹陪可以使用了

这样，在页面上就会显示这个组件，这个组件是固定的

动态组件是不固定要显示哪个组件，只是有个component标签，表示在模板的相应位置有一个组件，

它具体显示哪个组件，要根据它的is属性来决定

is绑定currentComponent是一个字符串，表示一个组件的名字，组件名字改变时，component标签这个位置显示的组件就会变化

还是用我们之前用过的两个组件做示例，表示两个不同的组件componentA和componentB，在点击按钮时，切换组件，

点击按钮就可以切换显示的组件

动态组件的内容就是这么简单，下面我竖蠢们来举一个实际应用中的例子，

比如在一个应用中的个人中心，有几个模块

假如这几个模块显示的顺序，或者哪个模块显示、哪个模块不显示是根据用户的不同有所区别的，

那么我们可以使用动态组件去实现这个功能，

1）把这个组件名字弯段都放到一个数组里，

2）通过for循环把这些组件用动态组件写在template中

3）控制数组的顺序和内容，实现组件的顺序和显示

这节课就是这些内容了，下节课再见。

关于vue动态组件和Vue动态组件原理的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。