学习vuejs的时候对这句代码不理解

new Vue({
el: '#app',
router,
store,
i18n,
render: h => h(App)
})

查找了有关资料,以下为结果

render: h => h(App)

等价于

{
render:h=>{
return h(App);
}
}

等价于

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

等价于

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

render:h=>h(App) 这是:

1、ES6的写法,表示Vue实例选项对象的render方法作为一个函数,接受传入的参数h函数,返回h(App)的函数调用结果

2、Vue在创建Vue实例时,通过调用render方法来渲染实例的DOM树

3、Vue在调用render方法时,会传入一个createElement函数作为参数,也就是这里的h的实参是createElement函数,然后createElement会以App为参数进行调用,关于createElement函数说明参见:

https://cn.vuejs.org/v2/guide/render-function.html#createElement-参数

官网介绍的很清楚,这样应该可以理解了。

如何理解render: h => h(App)的更多相关文章

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

    render: h => h(App) 是下面内容的缩写: render: function (createElement) { return createElement(App); } 进一步 ...

  2. Vue render: h => h(App) $mount

    $mount()手动挂载 当Vue实例没有el属性时,则该实例尚没有挂载到某个dom中: 假如需要延迟挂载,可以在之后手动调用vm.$mount()方法来挂载.例如: new Vue({ //el: ...

  3. vue中render: h => h(App)的详细解释

    2018年06月20日 10:54:32 H-L 阅读数 5369   render: h => h(App) 是下面内容的缩写:   render: function (createEleme ...

  4. vue-cli: render:h => h(App)是什么意思

    import Vue from 'vue' import App from './App.vue' Vue.config.productionTip = false new Vue({ render: ...

  5. 解析vue2.0中render:h=>h(App)的具体意思

    render:h=>h(App)是ES6中的箭头函数写法,等价于render:function(h){return h(App);}. 注意点:1.箭头函数中的this是 指向 包裹this所在 ...

  6. render:h => h(App) 是什么意思?

    在学习vue.js时,使用vue-cli创建了一个vue项目,main.js文件中有一行代码不知道什么意思.在网上搜索得到如下解答: 参考一:https://www.cnblogs.com/longy ...

  7. Vue2.0 render:h => h(App)

    new Vue({ router, store, //components: { App } vue1.0的写法 render: h => h(App) vue2.0的写法 }).$mount( ...

  8. Vue中render: h => h(App)的含义

    // ES5 (function (h) { return h(App); }); // ES6 h => h(App); 官方文档 render: function (createElemen ...

  9. render: h => h(App) $mount 什么意思

    初始一个vue.js项目时,常常发现main.js里有如下代码: new Vue({ render: h => h(App) }).$mount('#app') 这什么意思?那我自己做项目怎么改 ...

随机推荐

  1. JS之表单提交时编码类型enctype详解

    简介 form的enctype属性为编码方式,常用有两种:application/x-www-form-urlencoded和multipart/form-data,默认为application/x- ...

  2. SqlMapConfig配置加注解

    <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC & ...

  3. Openlayer3中应用的技术

    ol3-ext有很多很丰富的效果,可以不用重复造轮子,ol3-ext示例大全:http://viglino.github.io/ol3-ext/ 在本次项目中使用到了ol3-ext的两个功能:图层管理 ...

  4. 你不可不知的Java引用类型之——PhantomReference源码详解

    定义 PhantomReference是虚引用,该引用不会影响不会影响对象的生命周期,也无法从虚引用中获取对象实例. 说明 源码介绍部分其实也没多大内容,主要内容都在前面介绍中说完了.PhantomR ...

  5. mssql sqlserver 获取指定汉字的笔画数的方法分享

    转自:http://www.maomao365.com/?p=6421 摘要: 下文讲述计算汉字笔画数的sql函数分享,如下所示: 例:建立汉字笔画数sql函数 )) returns int as b ...

  6. 洗礼灵魂,修炼python(84)-- 知识拾遗篇 —— 网络编程之socket

    学习本篇文章的前提,你需要了解网络技术基础,请参阅我的另一个分类的博文:网络互联技术(4)——计算机网络常识.原理剖析 网络通信要素 1.IP地址: 用来标识网络上一台独立的终端(PC或者主机) ip ...

  7. hivesql优化的深入解析

    转载:https://www.csdn.net/article/2015-01-13/2823530 一个Hive查询生成多个Map Reduce Job,一个Map Reduce Job又有Map, ...

  8. ElementUI在IE11下兼容性修改

    1.在项目里面使用了axios.js来发送http请求,在IE下报错Promise未定义,解决办法: 到http://bluebirdjs.com/docs/getting-started.html  ...

  9. Linux下键盘值 对应input_evnet的code值。

    最近做了一个linux下面的模拟鼠标和键盘的app,但不是很清楚字符对应的键值:查找内核源码,在kernel/include/uapi/linux/input.h文件中找到: 下面给出普通键盘上面对应 ...

  10. June 14. 2018 Week 24th Thursday

    Good friends, good books, and a sleepy conscience: this is the ideal life. 拥有益友.良书和一颗宁静的内心:这就是理想的生活. ...