framework
framework/react/component/index.md
medium
framework-react-component-index
React 组件结构
子项索引
| 子项 | 一句话 |
|---|---|
| structure skill | React 组件文件结构模板（props/hooks/jsx 三段） |
| folder-layering skill | components/ features/<page>/ pages/ 三层目录约定 |
| flat-ui-principles skill | 扁平化设计形态 — 无阴影/边框层次/纯色/状态完备 |
| state-completeness skill | 组件状态完备 — 默认/悬停/焦点/激活/加载/禁用/错误/空态 |
| button-naming skill | 三类按钮：antd Button / 品牌 CTA / 业务包装 |
| spacing-typography skill | 间距与字号 — 留白即设计 / 字重建立层级 |
| key-stability skill | 列表 .map 渲染的 key 必用稳定业务 id，禁数组 index、禁 Math.random() |
| re-render-minimization skill | 消除多余 re-render — 先定位再 memo、稳定 prop 引用、内联 object/array/fn prop 反模式 |
| derived-state skill | 派生值渲染期直接算 — 能从 props/已有 state 推出的值别存 useState 再 useEffect 同步 |
| controlled-uncontrolled skill | 受控/非受控输入 — value 必始终 defined、value 与 defaultValue 二选一、数字输入解析下沉 |