关于vue的命名规范

简介: 前言:命名其实是很重要的,尤其项目越大,命名就应该越规范,要有语义化这应该是最基本的了,但是哪些地方该大写?哪里该小写?我将自己平常工作学习中在用vue的时候的一些命名规范分享一下,谈谈自己对命名的看法。

前言:命名其实是很重要的,尤其项目越大,命名就应该越规范,要有语义化这应该是最基本的了,但是哪些地方该大写?哪里该小写?我将自己平常工作学习中在用vue的时候的一些命名规范分享一下,谈谈自己对命名的看法。

1、组件命名

官网对组件名大小写是这么介绍的,定义组件名的方式有两种:

  • 使用kebab-case(短横线)
img_8c595c78fb3616b43bccef847289db3e.png
短横线
  • 使用 PascalCase(首字母大写) 注册
img_bf8eb11c1c2282675948a754f354aa6d.png
首字母大写
  • 但是在HTML模板中只能使用短横线
<!-- 在 html 模板中始终使用 kebab-case -->
<kebab-cased-component></kebab-cased-component>

2、文件命名

这是我个人在项目中总结的一些命名规范

  • 文件名统一采用驼峰式
  • 页面中import引入的名称与注册组件时的名字保持一致,使用首字母大写
  • 模板中使用组件必须使用短横线式
img_730f441fbff81066d4e80c851dfffa1c.png
vue的命名规范
目录
相关文章
|
1天前
|
JavaScript 前端开发
【vue】iview如何把input输入框和点击输入框之后的边框去掉
【vue】iview如何把input输入框和点击输入框之后的边框去掉
7 0
|
1天前
|
JavaScript
【vue实战】父子组件互相传值
【vue实战】父子组件互相传值
6 1
|
2天前
|
JavaScript
vue2_引入Ant design vue
vue2_引入Ant design vue
6 0
|
2天前
|
JavaScript
vue知识点
vue知识点
10 4
|
2天前
|
存储 JavaScript 前端开发
【Vue】绝了!这生命周期流程真...
【Vue】绝了!这生命周期流程真...
|
2天前
|
JavaScript 索引
【vue】框架搭建
【vue】框架搭建
7 1
|
2天前
|
JavaScript 前端开发 容器
< 每日小技巧: 基于Vue状态的过渡动画 - Transition 和 TransitionGroup>
Vue 的 `Transition` 和 `TransitionGroup` 是用于状态变化过渡和动画的组件。`Transition` 适用于单一元素或组件的进入和离开动画,而 `TransitionGroup` 用于 v-for 列表元素的增删改动画,支持 CSS 过渡和 JS 钩子。
< 每日小技巧: 基于Vue状态的过渡动画 - Transition 和 TransitionGroup>
|
2天前
|
JavaScript
【vue】setInterval的嵌套实例
【vue】setInterval的嵌套实例
8 1
|
2天前
|
JavaScript 前端开发 安全
【Vue】内置指令真的很常用!
【Vue】内置指令真的很常用!
|
2天前
|
JavaScript
【Vue】过滤器Filters
【Vue】过滤器Filters