命名

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

  • 命名法说明
  • 1).camel命名法,形如thisIsAnApple
  • 2).pascal命名法,形如ThisIsAnApple
  • 3).下划线命名法,形如this_is_an_apple ·
  • 4).中划线命名法,形如this-is-an-apple

说明: 所有的名称,包括文件名都作为大小写敏感来处理

JS

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

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

Vue 项目中的命名

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

HTML

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

CSS

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

转自:https://www.cnblogs.com/xkloveme/p/7743091.html

vue 项目中命名方法的更多相关文章

  1. Vue项目中的文件/文件夹命名规范

    Vue项目中的文件/文件夹命名规范 0.2262018.09.21 16:01:09字数 820阅读 6979 文件或文件夹的命名遵循以下原则: index.js 或者 index.vue,统一使用小 ...

  2. Vue项目中出现Loading chunk {n} failed问题的解决方法

    最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题 ...

  3. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  4. vue 项目中实用的小技巧

    # 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...

  5. 浅谈 Axios 在 Vue 项目中的使用

    介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...

  6. vue 项目中当访问路由不存在的时候默认访问404页面

    前言: 在Vue项目中,当访问的页面路由不存在或错误时,页面显示为一片空白.然而,通常我们需要对访问url不存在或者错误的情况下添加默认的404页面,即not found页面. 一般的处理方法是: 在 ...

  7. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

  8. scss/less语法以及在vue项目中的使用(转载)

    1.scss与less都是css的预处理器,首先我们的明白为什么要用scss与less,因为css只是一种标记语言,其中并没有函数变量之类的,所以当写复杂的样式时必然存在局限性,不灵活,而scss与l ...

  9. 转:如何在Vue项目中使用vw实现移动端适配

    https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...

随机推荐

  1. 那些年我们一起用过的 PHP 函数(一)

    用这个帖子记录一下 PHP 中比较常用的函数以及使用过程中需要注意的点,此贴持续更新 1.strpos() 函数     首先,我们知道 strpos() 函数是用于查找一个字符串在另一个字符串第一次 ...

  2. 同上篇 这篇是针对mesh的

    资源加载性能测试代码 与上篇所提出的测试代码一样,我们对于其他资源的加载性能分析同样使用该测试代码.我们将每种资源均制作成一定大小的AssetBundle文件,并逐一通过以下代码在不同设备上进行加载, ...

  3. 用html+css+js实现选项卡切换效果

    文章转载自:http://tongling.github.io/JSCards/ 用html+css+js实现选项卡切换效果 使用之前学过的综合知识,实现一个新闻门户网站上的常见选项卡效果: 文字素材 ...

  4. python中的3目运算(3元表达式)

    js中   ret  = 1 == 1 ? 'true' : 'false' python中   ret = 'true' if 1==1 else 'false'

  5. Meta referrer标签的,可以防止CSRF的攻击

    Meta referrer标签的简要介绍 在某些情况下,出于一些原因,网站想要控制页面发送给 server 的 referer 信息的情况下,可以使用这一 referer metadata 参数. 参 ...

  6. vue-router两种模式的区别

    参考文献:https://blog.csdn.net/lla520/article/details/77894985/ https://segmentfault.com/a/1190000015123 ...

  7. vue.js环境配置步骤及npm run dev报错解决方案

    安装完成后,使用npm run dev 运行,成功后,就可以在浏览器中看到vue的欢迎画面了 最后一步可能报错,我就遇到这样的问题了, 个人问题仅供参考: ERROR Failed to compil ...

  8. Java操作Kafka

    java操作kafka非常的简单,然后kafka也提供了很多缺省值,一般情况下我们不需要修改太多的参数就能使用.下面我贴出代码. pom.xml <dependency> <grou ...

  9. python中的面向对象学习以及类的多态

    接下来类的第三个重要的特性:多态(一种接口,多种实现) 多态性(polymorphisn)是允许你将父对象设置成为和一个或更多的他的子对象相等的技术,赋值之后,父对象就可以根据当前赋值给它的子对象的特 ...

  10. requests库使用:通过cookie跳过验证码登录,并用Session跨请求保持cookie

    拿我平时测试的一个系统为例,从UI层面来说必须先登录才可以进行后续操作,但是我在测试接口文档提供的接口时,发现并不需要登录,每个接口只要传参就可以正常返回.原因是我们这边专门弄了一个接口包来统一管理常 ...