学习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 控制超出字数显示省略号

    //多余显示省略号 function wordlimit(cname, wordlength) { var cname = document.getElementsByClassName(cname) ...

  2. git 常用操作,下拉,提交,更新,还原

    注: origin为远程仓库名称 master为远程分支名称   //第一次提交所有代码 1.git clone 项目url 2.复制.git 和文件到根目录 3.git add . 4.git co ...

  3. BZOJ1007: [HNOI2008]水平可见直线(单调栈)

    Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 8638  Solved: 3327[Submit][Status][Discuss] Descripti ...

  4. 移动端开发H5页面点击按钮后出现闪烁或黑色背景的解决办法

    H5页面在IOS端测试的时候发现,点击按钮会闪动,出现一个黑色的背景一闪而过,影响用户体验.最后通过度娘,找到解决方法: 就是给点击的元素添加一个CSS属性或者全局添加一个css. -webkit-t ...

  5. 苹果8plus怎么录屏视频

    现在越来越多的手机控,不管在什么地方,什么时候,都是低头看手机的居多,因为手机信息量太大了,一部手机就可以了解最新咨询,但是作为苹果8plus怎么录制手机屏幕,你们知道吗?今天就和大家一起分享苹果8p ...

  6. Python入门基础之函数、切片

    Python之函数 Python不但能非常灵活地定义函数,而且本身内置了很多有用的函数,可以直接调用. Python之调用函数 Python内置了很多有用的函数,我们可以直接调用. 要调用一个函数,需 ...

  7. Android笔试题三

    1.java堆得Young区由哪些组成: Java堆由Perm区和Heap区组成,Heap区由Old区和New区(也叫Young区)组成,New区由Eden区.From区和To区(Survivor)组 ...

  8. Spring Data Redis 让 NoSQL 快如闪电(2)

    [编者按]本文作者为 Xinyu Liu,文章的第一部分重点概述了 Redis 方方面面的特性.在第二部分,将介绍详细的用例.文章系国内 ITOM 管理平台 OneAPM 编译呈现. 把 Redis ...

  9. Cygwin下编译的程序不使用Cygwin.dll即可运行的命令 及常用命令简介

    cc -mno-cygwin foo.c 1.$ ps PS的相关用法: QuoteUsage ps [-aefl] [-u uid]-f = show process uids, ppids-l = ...

  10. CSS杂谈(1)图