首页 前端知识 vue中render: h => h(App)的理解

vue中render: h => h(App)的理解

2024-05-05 12:05:21 前端知识 前端哥 639 281 我要收藏
render: h => h(App)

=>es6 的箭头函数语法,并不陌生。但是h代表什么呢?跟踪源码后发现:hcreateElement函数的别名,于是上面的写法等价于:

render:function(createElement){
    return creatElemnt(App);
}

createElement是一个函数,以App为参数进行调用,生成一个 VNode节点。render 函数得到这个VNode节点之后,返回给 Vue.jsmount 函数,渲染成真实 DOM 节点,并挂载到根节点上。

createElement详细用法参考[官网],具体示例参考 [Vue中的render函数render: h => h(App)]。

源码中涉及到rendercreateElement比较重要的代码片段:

render

$createElement

createElement

解惑时刻

为啥将createElement别名化为h呢?翻到了尤大本人的回复:

h

来自于“hyperscript”的首字母。

于是,将h作为createElement的别名是Vue生态系统中的一个通用惯例。

转载请注明出处或者链接地址:https://www.qianduange.cn//article/6897.html
标签
评论
发布的文章

String转Json的几种方式

2024-05-09 11:05:04

iOS ------ JSONModel源码

2024-05-09 11:05:02

java去除 json 中的 \n, \t, \r

2024-05-09 11:05:57

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!