如何手动渲染组件

来源：2-11 v-loading 自定义指令的开发

慕莱坞0998854

2021-04-13

老师在实现自定义指令v-loading的时候，采用的是如下的形式:

我总感觉怪怪的。createApp这个函数一看名字就好像和Loading这么一个小组件不搭呢？有种杀鸡用牛刀的感觉?

然后我搜索了一下. 好像有这俩个函数createVNode和render,然后我把代码改成了如下形式

如上代码能运行，但是也有明显的弊端，我们需要一个container，然后这个container很鸡肋，因为上面的render函数需要它作为第二个参数。。。然后我们其实只需要Loading组件所对应的dom结构.

我的问题是:

1> vue3到底应该如何动态的渲染一个组件?上面的createVNode函数和render函数再文档里面的使用的介绍很少，我也不知道上面的用法对不对.

2> 我对组件和vnode之间的关系感觉不是很清楚，如上老师的代码里面instance代表的是组件的实例

而createVNode一看返回的就是vnode,上面的render函数没有返回值，那么我们如何从vnode里面获取相对应的组件实例呢?

写回答

1回答

ustbhuangyi

2021-04-13

我建议还是是课程那种玩法，应该是比较标准的玩法，本质上就是动态创建一个 App 实例去动态挂载组件，用 Vue 开发的项目也可以是多实例的，这种玩法在 Vue 2 中也经常玩，组件库也经常这么玩。

慕莱坞0998854

好的谢谢老师！

2021-04-13

共1条回复

Vue3开发企业级音乐Web App 明星讲师带你学大厂代码

慕课网明星讲师黄轶深度讲解 Vue3.0 ，提升的不止是Vue代码能力

2223 学习 · 1002 问题

相似问题

回答 1

回答 2

回答 1

回答 1

回答 1