关于 app.vue 组件的 render 函数问题
来源：3-2 createComponent
fy000
2020-08-05
就像大多数的 app.vue 一样
<template>
<div id="app">
{{message}}
</div>
</template>
<script>
export default {
name:'app',
data ....
}
</script>
老师请问,这一节中的 createComponent函数的参数 Ctor是 app export 的对象,那么请问老师,那我在 template 中的 html 是在何时编译成 render 函数的呢?是 vue-loader 么,是的话,我不是纠结怎么编译的,我是纠结在哪里 将编译后的组件类型的 render 函数 产生的 vNode,与createComponent产生的 vNode 结合在一起的? 还是其他逻辑,不知道老师听懂我的意思么…总之,就是 template 产生的 vNode 在哪里…
2回答
-
前端工程师666777888
2021-04-02
1、进入项目：在new Vue时会在vm.$mount()中生成一个render函数
这个render函数的参数包含了整个项目的信息
2、render函数的参数实际上是个函数：createElement函数，这个createElement函数总共可以传4个参数。
render函数仅仅是个外壳，其实真正执行的是createElement函数
3、其实支撑整个项目的是第一个和第三个参数
第一个参数基本上是div
第二个参数是div上的属性，基本可有可无
第三个参数是children。就是你要说的问题所在：children中包含所有子节点。
其实children中放的是：createElement()
________________________________________________________________________
在执行createElement函数时，其实先执行它的四个参数。
第三个参数children中可能还有createElement函数。
__________________________________________________________________
render: function (createElement) {
return createElement(
'div', // 第一个参数
{}, // 第二个参数 不用考虑
[createElement(),createElement(),createElement()], // 第三个参数
2) // 第四个参数 不用考虑
}
4个参数类似这种。先把children中的vnode生成，children中的vnode都生成完。
再调用挨着return 的最外面的createElement函数 这样就把真个项目的vnode生成了
00 -
ustbhuangyi
2020-08-06
render 函数执行的过程就是去创建组件的 vnode 树啊，看一下 render 函数的结果就知道了，参考：
https://cn.vuejs.org/v2/guide/render-function.html#%E6%A8%A1%E6%9D%BF%E7%BC%96%E8%AF%91032020-08-06
相似问题
回答 3
回答 1
回答 1
回答 1
回答 1