为了不让团队重复踩坑,并且保证项目的统一标准,我们在开发中应当遵循以下标准

TIP

  • 必要:要求严格实现。
  • 应该:大部分情况应该实现,可以根据实际情况而定。
  • 推荐:推荐的一些做法,能保持项目的整体统一性,提升用户体验。
  • 避免:项目中应该避免出现该类问题。

# 基础

描述 级别
接口参数、回显必须正确 必要
业务实现的整体流程必须正确 必要
UI还原度90%以上 必要

# 代码类

描述 级别
方法和必要注释要齐全 应该
单文件代码不能超过一千行 推荐

# 表单类

描述 级别
表单校验必须齐全且正确 必要
表单 必要

# 展示类

描述 级别
组件的风格,比如大小、圆角等要统一风格 * 应该
确认、取消按钮的左右位置,要保持统一 * 应该
设置合理的表格列宽度 应该
表格的操作列要固定在表格右侧 应该
数字展示时,可以考虑右对齐,方便用户对比数据及查看 应该
金额展示时,可以考虑右对齐并添加千分位,方便用户对比数据及查看 应该
接口请求应该合理使用loading,局部loading或全局loading 应该
图片展示类的内容,如果数据存在可能为空的情况,最好添加一个本地的默认图片,当没有远程图片时就使用使用本地的默认图片 推荐
如果没有特殊要求,一律使用默认无衬线字体设置:font-family: sans-serif; * 推荐
避免页面中出现双横向、竖向滚动条 避免

# 操作类

描述 级别
保存等操作按钮操作,应当做节流,并在保存的过程中添加loading禁用效果,节流和loading一起使用能有效防止用户多次触发同一个请求。 必要
保存修改等操作后,应在返回列表页时更新列表数据,如果没有做修改则不需要更新列表数据。 应该
删除、移除等需要慎重操作的地方,应该添加二次确认框 应该
适当增大热区范围,方便用户操作 推荐

# 性能类

描述 级别
为了兼顾访问速度和资源清晰度,静态图片的应该使用@2x倍图,并使用压缩工具 (opens new window)压缩 应该
如果静态文件压缩后仍超过200k,需要上传到公司CDN服务器上进行加速 应该