Vue和React在使用组件库时的命名区别

Vue

写在模版中的内容最终会被render，render时会区分标签与组件。

通过-短横线命名法 或 大驼峰命名法使用组件

<a-button><a-button/>
<MyComponent></MyComponent>

但是-短横线命名法容易引起歧义，比如组件名是一个单词(无法)，所以无法判断该渲染组件还是标签。大驼峰命名法不会有这种问题。

render(button)
render('button')

所以组件库添加了统一前缀，如antd：a-，element：el-

React

bael在线测试地址

React中使用-短横线命名法会被当做普通html元素看待，而非组件。

组件：

正常html元素：

-短横线命名法，也被视为html元素

总结

二者只是书写代码时的区别，最终都会被编译为html，至于命名方式不同是因为React的jsx 和 Vue的模版 编译规则不同。

	Vue	React
是否支持大驼峰命名法	是	是
是否支持短横线命名法	是	否（会被视为html元素，而非组件）