欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

vue2.x的深入学习--关于h函数的说明

时间:2022-11-17 10:15:27|栏目:JavaScript代码|点击:

vue项目中。写在.vue文件的template里的代码需要借助webpack的模板解析器插件才能解析。单个.html文件引入vue文件时,该vue文件顺便把模板解析器引入进来了(缺点是体积大)。

所以我们使用工程化开发项目时候,需要在package.json文件引入vue-template-compile,用于进行模板解析

在这里插入图片描述

如果没有模板解析器,就解析不了,但是vue-template-compile只能解析.vue文件里的模板,没办法解析.js文件里的模板:

所以当我们这么写的时候会解析不了

在这里插入图片描述

在这里插入图片描述

为什么解析不了?因为main.js文件引入的vue文件没有带模板解析器

在这里插入图片描述

在这里插入图片描述

vue.runtime.common.js是不带模板解析器的.vue文件,vue.js是带模板解析器的vue文件

在这里插入图片描述

如果我们在main.js引入带有模板解析器的vue.js文件,则可以解析template

在这里插入图片描述

在这里插入图片描述

为什么默认引入的是不带模板解析器的vue.js文件?
因为体积问题:

在这里插入图片描述

解决方案,

使用官方提供的render函数。他能够通过h函数去调用引入的vue-template-compile,也就是第九行代码↓相当于第十一行和第十二行加上loader模板解析器。

在这里插入图片描述

总结:

在这里插入图片描述

上一篇:javaScript中的空值和假值

栏    目:JavaScript代码

下一篇:如何使用Javascript获取距今n天前的日期

本文标题:vue2.x的深入学习--关于h函数的说明

本文地址:http://www.codeinn.net/misctech/219222.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有