当前位置： 移动技术网 > IT编程>脚本编程>vue.js > 浅谈Vue初学之props的驼峰命名

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

2019年06月03日  | 移动技术网IT编程  | 我要评论

cba什么时候季后赛,同城haobc,紫玫瑰求职讯息

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

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

以以下代码为例：

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

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

源码说明：

在vue的源码中创建vue组件的时候createcomponent()，解析组件的相关属性

// extract props
var propsdata = extractpropsfromvnodedata(data, ctor, tag);

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

除此之外，vue在initprops()，validateprop()时，都将驼峰形式的属性转换为横断线形式。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网