vue 项目中命名方法

简介: vue命名

命名
命名的方法通常有以下几类:

命名法说明
1).camelCase,形如thisIsAnApple
2).PascalCase,形如ThisIsAnApple
3).下划线命名法,形如this_is_an_apple ·
4).kebab-case,形如this-is-an-apple
说明: 所有的名称,包括文件名都作为大小写敏感来处理

JS

根据不同类型的内容,必须严格采用如下的命名法:

变量名:必须使用camelCase
参数名:必须使用camelCase
函数名:必须使用camelCase
方法/属性:必须使用camelCase
私有(保护)成员:必须以下划线_开头
常量名:必须使用全部大写的下划线命名法,如IS_DEBUG_ENABLED
类名:必须使用PascalCase
枚举名:必须使用PascalCase
枚举的属性:必须使用全部大写的下划线命名法
命名空间:必须使用camelCase
语义:命名同时还需要关注语义,如:
变量名应当使用名词
boolean类型的应当使用is、has等起头,表示其类型
函数名应当用动宾短语
类名应当用名词
Vue 项目中的命名

Store 中的Module 使用 camelCase
Store 中的Mutation 使用 全部大写的下划线命名法
Store 中的state/getters/action 使用camelCase
组件必须使用PascalCase
引用组件时禁止使用别名,模板内组件标签名遵循html 标签命名规范,或者使用组件名
组件名必须避免使用Vue保留标签名(包括HTML标签和Vue内部标签)
组件文件和组件使用相同的名字
前端路由路径使用全小写命名法
HTML

html 文件名必须使用小写字母
标签名必须使用小写字母
属性名必须使用小写字母
以上名称有多个单词情况下使用中划线分割
属性值必须用双引号包围
CSS

css 文件名必须使用小写字母
选择器必须单词全字母小写,多个单词情况下使用中划线分割
class选择器必须代表相应模块或部件的内容或功能,不得以样式信息进行命名
id 选择器必须保证页面唯一
同一页面,应避免使用相同的 name 与 id

相关文章
|
17天前
|
JavaScript API 开发者
Vue是如何进行组件化的
Vue是如何进行组件化的
|
17天前
|
JavaScript 前端开发 开发者
Vue是如何劫持响应式对象的
Vue是如何劫持响应式对象的
19 1
|
17天前
|
JavaScript 前端开发 API
介绍一下Vue中的响应式原理
介绍一下Vue中的响应式原理
26 1
|
17天前
|
JavaScript 前端开发 开发者
Vue是如何进行组件化的
Vue是如何进行组件化的
|
17天前
|
存储 JavaScript 前端开发
介绍一下Vue的核心功能
介绍一下Vue的核心功能
|
JavaScript Java 物联网
现有vue项目seo优化
现有vue项目seo优化
|
JavaScript 前端开发
重读vue电商网站45之项目优化上线
重读vue电商网站45之项目优化上线
134 0
重读vue电商网站45之项目优化上线
|
19天前
|
JavaScript 前端开发 开发者
vue 数据驱动视图
总之,Vue 数据驱动视图是一种先进的理念和技术,它为前端开发带来了巨大的便利和优势。通过理解和应用这一特性,开发者能够构建出更加动态、高效、用户体验良好的前端应用。在不断发展的前端领域中,数据驱动视图将继续发挥重要作用,推动着应用界面的不断创新和进化。
|
20天前
|
JavaScript 前端开发 开发者
vue学习第一章
欢迎来到我的博客!我是瑞雨溪,一名热爱前端的大一学生,专注于JavaScript与Vue,正向全栈进发。博客分享Vue学习心得、命令式与声明式编程对比、列表展示及计数器案例等。关注我,持续更新中!🎉🎉🎉
23 1
vue学习第一章
|
20天前
|
JavaScript 前端开发 索引
vue学习第三章
欢迎来到瑞雨溪的博客,一名热爱JavaScript与Vue的大一学生。本文介绍了Vue中的v-bind指令,包括基本使用、动态绑定class及style等,希望能为你的前端学习之路提供帮助。持续关注,更多精彩内容即将呈现!🎉🎉🎉
22 1
vue学习第三章