我们专注攀枝花网站设计 攀枝花网站制作 攀枝花网站建设
成都网站建设公司服务热线:400-028-6601

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

浅谈Vue初学之props的驼峰命名

在vue的中文官网有这样的说明:HTML 中的特性名是大小写不敏感的,所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时,camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名。

创新互联建站公司2013年成立,先为贞丰等服务建站,贞丰等地企业,进行企业商务咨询服务。为贞丰企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

重申一次,如果你使用字符串模板,那么这个限制就不存在了。

以以下代码为例:

1、当组件中template及props等使用驼峰式命名,在html中对应的改成短横线命名方式。

浅谈Vue初学之props的驼峰命名

2、当组件中template及props等使用字符串模板,在html中改成对应的小写。

浅谈Vue初学之props的驼峰命名

源码说明:

在Vue的源码中创建Vue组件的时候createComponent(),解析组件的相关属性

// extract props
var propsData = extractPropsFromVNodeData(data, Ctor, tag);

而,在extractPropsFromVNodeData()中,Vue通过调用内部方法hyphenate,把驼峰形式的属性转换为横断线形式。

浅谈Vue初学之props的驼峰命名

除此之外,Vue在initProps(),validateProp()时,都将驼峰形式的属性转换为横断线形式。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。


网页名称:浅谈Vue初学之props的驼峰命名
文章转载:http://shouzuofang.com/article/ieejhd.html

其他资讯