当前位置: 首页 > Web前端 > JavaScript

render-h=-什么是h(App)?

时间:2023-03-27 01:59:24 JavaScript

最近在看Vue的时候,发现main.js中App组件的注册有点不清楚:如果按照之前创建Vue实例的方法注册组件的话,貌似应该这样写importAppfrom'./App'newVue({el:'#app',template:'',components:{App}})这是什么渲染:h=>h(App)意思是?网上搜了一下,说这两种写法是等价的,但是在实际操作中,当我把代码改成上面的写法时,会报错。报错如下:这段话是什么意思?这意味着您正在使用Vue的运行版本,没有可用的模板解析器。要么使用render来处理需要编译的模板,要么换一个包含模板解析器的版本。让我们来看看两者吧!第一个:由于我们使用的Vue版本缺少模板解析器,所以先看看我们使用的Vue(小技巧,Ctrl+鼠标左键点击直接跳转到引用文件)。跳转之后,我们可以查看vue文件夹下的package-json,这里可以看到引用的版本是vue.runtime.esm.jsvue.runtime.xxx.js,表示这是vue的运行版本,只包含核心功能,但没有Templateparser,所以我们写的模板无法解析。由于版本不对,我们可以通过修改main.js引用的vue版本来解决错误(不推荐,但没必要!!)importVuefrom'vue/dist/vue.js'第二种:vue建议我们使用render函数,我们先来看看render。详情请参考官方文档。事实上,我们看到的最后一个渲染:h=>h(App)是简写。完整版应该是:进一步简写:finally改成ES6arrow函数就变成了我们现在看到的render:h=>h(App)。至于为什么用h而不用createElement,这个在官方文档中是有写的。