Skip to content

uni-app 端开发规范

页面配置规范

pages.json 作为 uni-app 的核心配置文件,承载着整个应用的页面路由、导航栏样式、底部TabBar等重要配置。在配置过程中需要严格遵循以下原则:

  1. 路径规范 :页面路径必须以"app/pages/"开头,确保与目录结构保持一致

  2. 国际化支持 :所有导航栏标题必须使用语言包键名,格式为"%pages.xxx.xxx%",严禁硬编码文本

  3. 平台差异化处理 :合理使用条件编译,针对不同平台设置差异化样式

  4. 登录权限控制 :需要登录的页面必须显式声明"needLogin": true

页面组件开发标准

每个页面组件都应该遵循统一的结构和命名规范,确保代码的可读性和可维护性

组件设计原则

组件是构建用户界面的基本单元,良好的组件设计能够提高代码复用性和可维护性。在开发过程中需要遵循以下原则:

  1. 单一职责原则 :每个组件应该只负责一个功能,避免组件过于复杂

  2. props向下传递 :数据通过props自上而下传递,避免逆向数据流

  3. 事件向上传递 :子组件通过emit向父组件传递事件

  4. 样式隔离 :组件样式必须使用scoped,避免样式污染

Pinia Store设计原则

状态管理是大型应用的核心,良好的状态设计能够确保数据流的清晰和可预测性:

  1. 状态单一化 :避免在多个地方存储相同的状态

  2. 状态最小化 :只存储必要的状态,派生状态通过计算属性获取

  3. 异步操作集中化 :所有的异步操作都放到actions中处理

  4. 状态持久化 :重要状态需要持久化到本地存储

WindiCSS使用规范

WindiCSS作为原子化CSS框架,能够极大提高样式开发效率,但需要遵循一定的使用规范:

  1. 优先使用原子类 :能用原子类实现的样式不要使用自定义CSS

  2. 响应式设计 :使用断点前缀实现响应式布局

  3. 主题色彩 :使用CSS变量确保主题一致性

  4. 性能优化 :避免过度嵌套,控制样式复杂度

基于 MIT 协议发布