vue props命名为啥使用kebab-case (短横线隔开式) 来命名

vue官方文档：

Prop 的大小写 (camelCase vs kebab-case)

HTML 中的 attribute 名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名：

Vue.component('blog-post', {
  // 在 JavaScript 中是 camelCase 的
  props: ['postTitle'],
  template: '<h3>{{ postTitle }}</h3>'
})

<!-- 在 HTML 中是 kebab-case 的 -->
<blog-post post-title="hello!"></blog-post>
//props中传递的数据可以为驼峰式也可以为短横线式，他们在此处是相互转换的，但推荐短横线式

另外一个例子↓：

<child v-bind:my-message="message"></child>
<!--此处的my-message只能是短横线命名（若为驼峰式则全部转换为小写。）-->
以及推荐emit也遵循这样的法则：
this.$emit('event-name', data);

---

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

template:'<p>{{myMessage}}</p>'
 // 此处有限制，是字符串模板，{{ }}语法中不能是短横线连接方式。此处只能是驼峰命名方式。