项目开发通用注意事项

统一文字风格

P.S. 风格包括:字体,字号,粗细,行高,行间距,颜色,溢出控制

  • 一级标题文字风格
  • 二级标题文字风格
  • 三级标题文字风格
  • 模态框标题文字风格
  • tips文字风格
  • 段落文字风格
  • 表格头文字风格
  • 表格内容文字风格
  • 普通超链接文字风格,表格内类超链接文字风格
  • form编辑状态下表单项label文字风格,input类组件的文字风格
  • form查看状态下表单项label文字风格,值文字风格
  • form混合模式下采用哪种风格
  • form表单错误提示文字风格

字典数据的获取时机

时机: 只在当前界面中需要使用的时候再去获取

原因:

  • 尽量避免无意义的请求
  • 加快系统响应速度
  • 有时候需要字典数据来完成当前vue组件的初始化,如果字典数据是在某些公共入口中预加载的,那可能没法确定created或mounted方法执行时字典已加载完毕,为求稳妥就必须在created或mounted方法中,再次请求一次数据,这样就造成了资源重复加载,当然也可以在watch中进行判断,但这可能导致组件初始化逻辑割裂,逻辑相关的代码还是应该尽量聚合在一起的

字典风格的数据如何展示

真字典数据

定义: 后端有专门存储字典code,字典显示文案的这类数据

显示:

无论是用于表单/填写类组件的显示,还是纯显示组件中的显示,都要求即返回code又返回对应显示文案,显示时直接显示文案。

为什么要这样控制?

  • 降低显示组件的复杂度
  • 避免出现先是code,过了一会又变成了文案的情况
  • 减少不必要的ajax请求,增加前端界面响应速度
  • 优化大数据组件的显示逻辑控制

假字典数据:

定义: 只有口头约定的code与显示值,后端并未实际存储code与显示值对应关系的这类数据(常见的是状态的展示)

显示:

将code与文案的对应关系,保存在一个单独的文件中,显示的时候,根据code到这个单独文件中获取对应的文案

为什么要这样控制?

  • 提取到单独文件,方便统一管理

前端如何获取特定的时间

无界面情况下获取当前时间: 这个当前时间应该从后端获取,因为前端直接new Date()获取的时间,不能保证准确性(因为客户端的时间是可以调的)

大界面/复杂界面

  • 一定要分组件实现,利用vue组件级别的精确更新,尽量避免可能的卡顿问题
  • 避免实现可编辑表格的UI界面,如果一定要实现这种,尽量只实现行编辑或单元格编辑,因为可编辑表格如果可编辑的单元格很多,很容易造成卡顿
  • 对于树组件和下拉组件,一定要确认树节点或下拉选项不会很多,否则很容易造成卡顿,树组件的优化方案是,优先考虑替换树结构为列表结构,下拉框列表,采用远程搜索实现,即使根据搜索条件,能搜到很多数据,也最多只返回有限条数据

猜你喜欢

转载自juejin.im/post/7131389664811810823