关于Vue中命名大小写（驼峰式自动转译成短横线式）的问题

字符串模板: 对象中作为templet的属性值，是出现在js中的，DOM模板: 直接作用与HTML代码中，是出现在<templet>标签中的。因为HTML标签的属性名是大小写不敏感的，会被自动识别成小写因此无法在标签标签中使用驼峰命名，但js却可以使用驼峰命名为了解决这个冲突，Vue会在底层自动将短横线式等价为命名驼峰式，使用短横线命名在DOM模板中使用组件名、props等都会涉及到这

海胆Sur

2962人浏览 · 2021-08-11 17:23:06

海胆Sur · 2021-08-11 17:23:06 发布

字符串模板: 对象中作为 template 的属性值，是出现在js中的，
DOM模板: 直接作用与HTML代码中，是出现在<templet>标签中的。

因为HTML标签的属性名是大小写不敏感的，会被自动识别成小写
因此无法在标签标签中使用驼峰命名，但js却可以使用驼峰命名
为了解决这个冲突，Vue会在底层自动将短横线式等价为命名驼峰式，使用短横线命名在DOM模板中使用

组件名、props等都会涉及到这个问题 DOM模板中只有短横线名名适用

组件名 如果使用驼峰式，则为大驼峰（首字母大写）
组件名相当于自定义标签，建议按照Web标准，采用短横线命名

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^