vue中自定义组件的命名规则详解
作者：小星星星★
Vue组件在HTML中需用连字符分隔（如like-big）,因HTML不区分大小写会自动转为小写,导致无法匹配组件,直接使用大写会导致解析错误,正确写法应遵循HTML标签转义规则
问题
vue中自定义的组件名在html中字母大写会报错
- html：
- js：
自定义的组件中字母可以大写，但是在html标签中，字母有大写的就会报错
原因
- 这是因为html中不区分大小写，所以在html中如果写为 likeBig，就会自动解析为 likebig
- 匹配的优先顺序从高到低为：原标签名、likeBig化的标签名、LikeBig化的标签名
- 而由于 html解析成likeBig时，相当于将该标签当成了一个单词进行了转换，所以它的匹配顺序为likebig，likebig，Likebig，所以找不到对应组件
解决的办法
- 在html标签中将两个单词用-隔开，like-big，这时就相当于是两个单词
- 会依次匹配 like-big，likeBig，LikeBig
总结
vue中是支持命名中有字母大写的，但是模板解析插入dom时，不区分大小写，都转成了小写，所以会导致，匹配不到对应的组件
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。