关于Vue中的 render: h => h(App) 具体是什么含义？

ゞ浴缸里的玫瑰 2024-04-18 13:23 5阅读 0赞

render: h => h(App) 是下面内容的缩写：

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

进一步缩写为(ES6 语法)：

render (createElement) {
        return createElement(App);
    }

再进一步缩写为：

render (h){
        return h(App);
    }

按照 ES6 箭头函数的写法，就得到了：

render: h => h(App);

其中 根据 Vue.js 作者 Even You 的回复，h 的含义如下：

> It comes from the term “hyperscript”, which is commonly used in many virtual-dom implementations. “Hyperscript” itself stands for “script that generates HTML structures” because HTML is the acronym for “hyper-text markup language”.  
> 它来自单词 hyperscript，这个单词通常用在 virtual-dom 的实现中。Hyperscript 本身是指  
> 生成HTML 结构的 script 脚本，因为 HTML 是 hyper-text markup language 的缩写（超文本标记语言）  
> \*\*理解：createElement 函数是用来生成 HTML DOM 元素的，也就是上文中的 generate HTML structures，也就是 Hyperscript，这样作者才把 createElement 简写成 h。

Vue.js 里面的 createElement 函数，这个函数的作用就是生成一个 VNode节点，render 函数得到这个 VNode 节点之后，返回给 Vue.js 的 mount 函数，渲染成真实 DOM 节点，并挂载到根节点上。\*\*

还有另外一种写法效果是一样的：

import App from './App'
    new Vue({
        el: '#root',
        template: '<App></App>',
        components: {
            App
        }
    })

发表评论取消回复

表情：

评论列表（有 0 条评论，5人围观）

还没有评论，来说两句吧...

相关阅读

相关关于Vue中的 render: h => h(App) 具体是什么含义？

ender: h => h(App) 是下面内容的缩写： render: function (createElement) { return c...

ゞ浴缸里的玫瑰/ 2024年04月18日 13:23/ 0 赞/ 6 阅读

相关什么是 SSH？SSH 在 Linux 中的含义

Secure Shell (SSH) 是一种广泛使用的网络协议，它提供了一种访问远程服务器和计算机的安全方式。在 Linux 中，SSH 是远程管理和文件传输的必备工具。在

桃扇骨/ 2024年03月22日 19:10/ 0 赞/ 24 阅读

相关 Vue.js中的 $ 的含义？ vue中的data为什么是一个函数？

Q：vue中的 $ 的含义？ > 实例创建之后，可以通过 `vm.$data` 访问原始数据对象。Vue 实例也代理了 data 对象上所有的 property，因此访问

古城微笑少年丶/ 2022年12月18日 02:52/ 0 赞/ 238 阅读

相关【转】CT的FOV是什么含义

CT的FOV是什么含义 - ：视场,也可以说扫描范围24mm 在光学中FOV是什么意思 - ：视场角(FOV): 一个光学系统所能成像的角度范围. 角度越大, 则这个光学

ゞ浴缸里的玫瑰/ 2022年09月08日 15:53/ 0 赞/ 595 阅读

相关 vue Render：h=>h(App) 解析

在学习VUE时，发现很多的组件的引入都是用ES6，需要在main.js中写入如下代码： export default () => { const rout

向右看齐/ 2022年04月11日 09:52/ 0 赞/ 153 阅读

相关 vue中的render函数介绍

简介：对于不了解slot的用法（参考：[大白话vue-slot的用法][vue-slot]）又刚接触render函数的同学来说，官网的解释无疑一脸懵逼，这里就整理下个人对ren

逃离我推掉我的手/ 2022年01月27日 20:47/ 0 赞/ 223 阅读

相关 Vue中import '@...'是什么

[Vue中import '@...'是什么][Vue_import _...] 今天看新项目代码，有import '@/assets/css/theme/index.cs

怼烎@/ 2021年11月14日 14:26/ 0 赞/ 462 阅读

相关 B树中的M阶是什么含义？

定义： ![在这里插入图片描述][20190826094017537.png] 描述一颗 B树时，需要指定它的阶数，什么是阶数？阶数表示此树的节点最多有多

迷南。/ 2021年11月05日 07:50/ 0 赞/ 701 阅读

相关 Vue 的 render 方法中 h 是什么？

Vue 的 render 方法中 h 是什么？如果你接触过vue一段时间了，那么你可能会遇到过 rendering 方法在你的app文件中 — 在最新版本的 CLI中它...

红太狼/ 2020年06月22日 15:03/ 0 赞/ 805 阅读

相关什么是h5

什么是h5 H5是指第5代HTML，也指用H5语言制作的一切数字产品。所谓HTML是“超文本标记语言”的英文缩写。我们上网所看到网页，多数都是由HTML写成的。“超文本”...

小灰灰/ 2020年06月10日 13:38/ 0 赞/ 936 阅读