Vue官方文档中的camelCased (驼峰式) 命名与 kebab-case

最新推荐文章于 2023-12-12 15:53:23 发布
最新推荐文章于 2023-12-12 15:53:23 发布
阅读量623 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/eret9616/p/9356023.html
版权

因为html特性中 元素的 prop是不区分大小写的

 

所以不管html中怎么大写小写变化，下面的组件的prop应该写成小写

 

 

Vue中有这样一种设定:

props中如果使用为kebab-case命名方式

组件可以使用camelCase命名时(当然也可以使用它本来对应的kebab-case)，它会自动转换的

 

prop中:

 

 

 

对应的组件的props

 

转载于:https://www.cnblogs.com/eret9616/p/9356023.html

dglf54292
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
浅谈Vue初学之props的驼峰命名
12-10
这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名。 重申一次，如果你使用字符串模板，那么这个限制就不存在了。 以以下代码为例： 1、当...
Vue这些修饰符帮我节省20%的开发时间
最新发布
m0_63102527的博客
03-18 752
相关文章手写简易版vue-routerVue 中 Axios 的封装和 API 接口的管理10个实用技巧让你的 Vue 代码更优雅last转发文章并关注公众号：前端开发博客，回复 1024，领取前端进阶资料回复「Vue」获取 Vue 精选文章小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数初中级前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！
vue中的修饰符
qq_43258522的博客
12-12 155
prevent：阻止默认行为（e.preventDefault()）用法：v-on:submit.prevent。self：当在event.target是当前元素自身时触发 用法：v-on:click.self。stop：阻止冒泡（e.stopPropagation()）用法：@click.stop。capture：事件从自身开始往下捕获 用法：@click.capture。native：监听根元素的元素事件 用法：v-on:click.native。left：左击 用法：@click.left。
vue修饰符简略总结
weixin_58487208的博客
11-12 519
vue修饰符主要分为: 1.表单修饰符; 2.事件修饰符; 3.按键修饰符,其中包含特殊修饰符: 系统修饰键, .exact修饰符; 4.鼠标按钮修饰符; 5.其他修饰符,包含: .sync, .prop, .camel 一、表单修饰符(用法一致为表单元素使用v-model时加修饰符:v-model.修饰符) 1) .trim: 去除仅首尾的空格 2) .lazy...
编程规范 三种命名方法PascalCase,camelCase,hungarian_notation， kebab-case 形式
qq_50630857的博客
12-16 726
编程规范 命名方法
vue 学习之 camelcase 配置
繁夜
03-20 1418
源链接 有时候写vue会遇到如下错误， error Identifier ‘x_label’ is not in camel case 这是因为ESLint代码规范检测的要求，必须要求用骆驼式变量名，当我们写成下划线形式就出现error 解决办法： 1）对一个文件 如果是JS文件，在开头加上这样一行代码来取消对骆驼式变量名的检测： /* eslint-disable camelcase */ 如果是TS文件： /* eslint-disable @typescript-eslint/camelcase */
vue-ydui使用文档
01-11
vue-ydui官方文档打不开。这是本地静态的文档，可参考使用。
VUE官方文档最新离线文档(2.0和3.0)
11-02
VUE官方文档(2.0和3.0)，不需要安装任何HTTP_SERVER，WINDOWS/LINUX下都可以使用，不好用或者资源是假的，留言骂我，不要客气。
Vue-grid-layout官方文档
03-11
1.详细介绍了Vue-Gird-layout的使用及API
vue组件中camelCased (驼峰式) 命名与 kebab-case（短横线命名）
热门推荐
王小森的成长博客
07-12 4万+
vue中组件和html中命名方式（camelCase 和 kebab-case ）的分析理解
IDEA插件（CamelCase.jar）也适用于phpstorm
05-10
通过phpstrom软件中在线安装的CamelCase插件，每次新建项目都需要配置一次。该插件重新编译了CamelCase插件，默认只勾选了CamelCase和snake_case两种格式。
Vue 32个修饰符，你不一定全知道！
前端开发博客
01-18 1万+
点击上方前端开发博客，关注公众号回复加群，加入前端群前言vue简洁好用体现在很多个地方，比如其内置了32+修饰符，可以很方便我们阻止冒泡、阻止默认事件、鼠标事件处理、系统键盘事件等等，让...
【vscode】vscode常用插件介绍
qq_42146383的博客
03-17 1万+
1、Angular Snippets（angular片段） 这个扩展为 TypeScript 和 HTML 添加了 Angular 的代码片段。 2、Auto Close Tag（自动闭合标签） 自动添加 HTML/XML 关闭标记。 3、Auto Rename Tag（自动重命名标签） 自动重命名成对的 HTML/XML 标记。 3、Bracket Pair Colorizer 2 （括号对色） 用于为匹配括号着色的可定制扩展，v2 使用与 VSCode 相同的括号解析引擎，大大提高了速度和准确性。
Vscode快速配置(1)之基础工具
Once_day的回忆
02-28 1921
下面是一些基础插件，基本上嵌入式程序员都会用到。首先是远程连接，为什么呢？这是考虑嵌入式程序员一般在Linux环境下编译测试，但在windows环境下工作。一般可以在各类云服务提供商购买云服务器，然后通过git工具开始远程开发，好处非常明显，对于很多小型开发任务和简易的算法测试，云服务随时可用。如果是复杂的编译，如Linux内核，那么还是应该在一台强力主机中使用Linux环境编译，如虚拟机和Windows子系统。简而言之，远程连接开发已是主流了。
vue之camelCase vs kebab-case
qq_42526440的博客
02-09 336
Prop 的大小写 (camelCase vs kebab-case) HTML 中的 attribute 名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名法) 命名： Vue.component('blog-post', { // 在 JavaScript 中是 camelCase 的 props: ['postTitle'], tem
驼峰命名法介绍及应用示例
WangWebstorm的博客
11-07 323
驼峰命名法介绍及应用示例
Vue检测报错Identifier is not a camel case (camelcase)
weixin_41996632的博客
01-24 2万+
在.eslintrc.js中添加rules规则中添加 "rules": { "camelcase": ["error", {"allow": ["aa_bb"]}] }  
vue.esm.js:634 [Vue tip]: Prop "receivetime" is passed to component <Anonymous>, but the declared prop name is "receiveTime". Note that HTML attributes are case-insensitive and camelCased props need to use their kebab-case equivalents when using in-DOM templates. You should probably use "receive-time" instead of "receiveTime".
07-25
在模板中使用驼峰式命名的props时，需要使用短横线分隔的kebab-case形式。 所以，您需要将属性名从"receiveTime"改为"receive-time"，以解决这个警告。 例如，将以下代码： ``` <water-overproof-form :visible....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值