views 命名

views 文件夹下面是由 以页面为单位的vue文件 或者 模块文件夹 组成的,放在 src 目录之下,与 components、assets 同级。

views 下的文件夹命名

  1. views 下面的文件夹代表着模块的名字
  2. 由名词组成(car、order、cart)
  3. 单词只能有一个(good: car order cart)(bad: carInfo carpage)
  4. 尽量是名词(good: car)(bad: greet good)
  5. 以小写开头(good: car)(bad: Car)

views 下的 vue 文件命名

  1. views 下面的 vue 文件代表着页面的名字
  2. 放在模块文件夹之下
  3. 只有一个文件的情况下不会出现文件夹,而是直接放在 views 目录下面,如 Login Home
  4. 尽量是名词
  5. 大写开头,开头的单词就是所属模块名字(CarDetail、CarEdit、CarList)
  6. 名字至少两个单词(good: CarDetail)(bad: Car)
  7. 常用结尾单词有(Detail、Edit、List、Info、Report)
  8. 以 Item 结尾的代表着组件(CarListItem、CarInfoItem)

vue 方法命名

vue 方法放置顺序

  1. components
  2. props
  3. data
  4. created
  5. mounted
  6. activited
  7. update
  8. beforeRouteUpdate
  9. metods
  10. filter
  11. computed
  12. watch

method 自定义方法命名

  1. 动宾短语(good:jumpPage、openCarInfoDialog)(bad:go、nextPage、show、open、login)
  2. ajax 方法以 get、post 开头,以 data 结尾(good:getListData、postFormData)(bad:takeData、confirmData、getList、postForm)
  3. 事件方法以 on 开头(onTypeChange、onUsernameInput)
  4. init、refresh 单词除外
  5. 尽量使用常用单词开头(set、get、open、close、jump)
  6. 驼峰命名(good: getListData)(bad: get_list_data、getlistData)

data props 方法注意点

  1. 使用 data 里的变量时请先在 data 里面初始化
  2. props 指定类型,也就是 type
  3. props 改变父组件数据 基础类型用 $emit ,复杂类型直接改
  4. ajax 请求数据用上 isLoading、isError 变量
  5. 不命名多余数据,现在是详情页、你的数据是 ajax 请求的,那就直接声明一个对象叫 d,而不是每个字段都声明
  6. 表单数据请包裹一层 form

生命周期方法注意点

  1. 不在 mounted、created 之类的方法写逻辑,取 ajax 数据,
  2. 在 created 里面监听 Bus 事件

Vue命名规范的更多相关文章

  1. 【转载】Vue项目中的文件/文件夹命名规范

    文件或文件夹的命名遵循以下原则: index.js 或者 index.vue,统一使用小写字母开头的(kebab-case)命名规范 属于组件或类的,统一使用大写字母开头的(PascalCase)命名 ...

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

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

  3. 前端开发规范:命名规范、html 规范、css 规范、js 规范

    上周小组的培训内容是代码可读性艺术,主要分享如何命名.如何优化代码排版,如何写好的注释.我们都知道写出优雅的代码是成为大牛的必经之路. 下面感谢一位前端开发小伙伴总结的前端开发规范,通过学习相关开发规 ...

  4. vue文件名规范

    之前有看过一些命名规范,也看到说vue文件命名要么全是小写要么就是用小写 + '-':其实看到的时候有点不以意,因为本地能跑起项目:发布能正常访问也就OK了. 但是今天在做自动化部署的时候碰到一个问题 ...

  5. CSS BEM 命名规范简介

    [前言] BEM 是一个简单又非常有用的命名约定.让你的前端代码更容易阅读和理解,更容易协作,更容易控制,更加健壮和明确,而且更加严密.这篇文章主要介绍了CSS BEM 命名规范简介(推荐)的相关资料 ...

  6. vue开发规范

    一.简介 团队合作中规范文档是必须的,在多人合作的项目只有定义好一定的编码规范才会使得开发井井有序,代码一目了然,下边将谈一下个人对vue使用规范的一些看法. 二.规范案例 1.组件命名 组件文件名应 ...

  7. 前端开发规范:命名规范、HTML 规范、CSS 规范、JavaScript 规范

    一个好的程序员肯定是要能书写可维护的代码,而不是一次性的代码,怎么能让团队当中其他人甚至一段时间时候你再看你某个时候写的代码也能看懂呢,这就需要规范你的代码了.我是有一点强迫症的人,上周我们后端给我了 ...

  8. vue 开发规范

    本文档为前端 vue 开发规范 规范目的 命名规范 结构化规范 注释规范 编码规范 CSS 规范 规范目的 为提高团队协作效率 便于后台人员添加功能及前端后期优化维护 输出高质量的文档 命名规范 为了 ...

  9. 前端开发规范之命名规范、html规范、css规范、js规范

    在学习编程的时候,每次看到那些整齐规范的代码,心里顿时对这个程序员表示点点好感,有时,比如看到自己和朋友写的代码时,那阅读起来就是苦不堪言,所以,一些基本的开发规范是必须的,是为了自己方便阅读代码,也 ...

随机推荐

  1. 工控随笔_C#连接PLC_之_C#入门_02_程序性结构和注释

    前段时间看C#本质论,发现内容有点抽象,不适合入门,现在换了一本适合入门的书籍: C#图解教程. //引用命名空间,命名空间相当于一个容器,通过不同的容器来区分同名的内容 //System命名空间是. ...

  2. 阿里云k8s事件监控

    事件监控是Kubernetes中的另一种监控方式,可以弥补资源监控在实时性.准确性和场景上的缺欠.Kubernetes的架构设计是基于状态机的,不同的状态之间进行转换则会生成相应的事件,正常的状态之间 ...

  3. 在Eclipse中设置中文JavaDOC

    参考: 在Eclipse中设置中文JavaDOC

  4. opencv之重映射

    好久没写呆码了 今天发个重映射 #include "opencv2/video/tracking.hpp" #include "opencv2/imgproc/imgpr ...

  5. 2019-7-01 python基础数据类型

    一.python的注释 python的注释分类: 单行注释:  #    单行注释 多行注释:(可以是三个单也可以是三个双) ''' 单三引号多行注释 ''' """ 双 ...

  6. Java 中的 equals,==与 hashCode 的区别与联系

    一. 关系操作符 ==:若操作数的类型是基本数据类型,则该关系操作符判断的是左右两边操作数的值是否相等若操作数的类型是引用数据类型,则该关系操作符判断的是左右两边操作数的内存地址是否相同.也就是说,若 ...

  7. C语言开发中常见报错的解决方案

    C语言开发中常见报错的解决方案 整理来源于网络,侵权请通知删除.*禁止转载 ---- fatal error C1003: error count exceeds number; stopping c ...

  8. Go基础编程实践(四)—— 数组和map

    数组去重 package main import "fmt" func main(){ intSlice := []int{1,5,5,5,5,7,8,6,6, 6} fmt.Pr ...

  9. Oracle学习笔记(四)

    Oracle中的体系结构: oracle体系结构中的进程: 共享池相关的优化: drop table t purge; create table t as select * from dba_obje ...

  10. navicat连接mysql出现2059

    1.找到mysql的目录:C:\Program Files\MySQL\MySQL Server 8.0\bin 2.清空此目录,输入cmd,回车 3.在控制台输入:mysql -u root -p ...