学习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. chrome 开发者工具,查看元素 hover 样式

    在web开发中,浏览器开发者工具是我们常用的调试工具.我们经常会有这样的需求,就是查看元素的时候需要查看它的hover样式.相信有很多小伙伴都遇到过这样的情形,始终选不中hover后的元素状态.其实在 ...

  2. loadrunner 脚本录制-Action分类

    脚本录制-Action分类 by:授客 QQ:1033553122 Action分类 l . Vuser_init 2. Vuser_end 3.  Action 在lr中用户的初始化操作应该存放在V ...

  3. mysql左连接

    举个例子说明: select d.id, d.uid,d.username,d.dateline, d.message,d.replynum, c.picid, c.filename from doi ...

  4. 布局优化之ViewStub源码分析

    源码分析 @RemoteView public final class ViewStub extends View { private int mInflatedId; private int mLa ...

  5. WPF:Metro样式ProgressBar(圆点横向移动),自适应宽度

    先看效果图: 最直观的,这是4个圆点在移动,就用一个横向的StackPanel表示这四个点吧. <StackPanel Orientation="Horizontal"> ...

  6. OpenCV 4.0.1 找不到R.styleable解决

    OpenCV 4.0.1作为模块导入Android Studio会有找不到R.styleable的问题. 解决方法 1.导入模块前 将 opencv-4.0.1-android-sdk\OpenCV- ...

  7. MS SQL CASE WHEN 的用法

    前言 由于经常使用 case when 的2种情况方式,如果=1 则*** 否则 *** 结束.久而久之,都以为只能这么用,都忘记了Case WHEN 的用法. 示例   ,              ...

  8. php的register_long_arrays可以关闭以提高性能

    如果你使用php5.0以上,在程序中没有使用$HTTP_*_VARS这种变量,那么就可以考虑将register_long_arrays设置为Off,来提高一点点性能.看下PHP手册中关于registe ...

  9. Docker 从入门到实践(二)Docker 三个基本概念

    一.Docker 的三个进本概念? 了解 Docker 的三个基本概念,就可以大致了解 Docker 的生命周期. 镜像(Image) 容器(Container) 仓库(Repository) 二.镜 ...

  10. 聚类——K-means

    聚类——认识K-means算法 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 一.聚类与分类 聚类: 无监督学习.聚类是在预先不知道欲划分类的情况下, ...