概述:聚焦可维护性与复用。状态分层、最小封装、清晰模块边界、函数拆分控制环复杂度。

对比

  • 状态提升与分层
    • 需跨模块复用或多处读取的状态提升到全局(如分页依赖搜索条件 → 放入 zustand/redux/context实现状态管理),其余局部状态封装在 Hook 中。
  • 封装的度
    • 避免过度抽象;尽可能复用通用能力(如统一 axios/API 请求函数、错误处理、鉴权拦截)。
    • 目录按“功能模块”细分,沉淀跨项目可复用单元。
  • 函数粒度与环复杂度
    • 长函数拆分为可测试的子函数;条件分支提炼为独立判定函数;早返回降低嵌套。
  • 一致性与约定
    • 类型定义集中管理;UI/状态/数据边界清晰;组件输入输出稳定。

示例

  • 分页切换需要携带搜索条件:将搜索条件入全局状态,分页组件仅从全局读取;检索面板仍维护其内部临时 UI 状态。

参考