名称: react-composition-patterns 描述: 可扩展的React组合模式。在重构具有布尔属性泛滥的组件、构建灵活的组件库或设计可重用的API时使用。触发涉及复合组件、渲染属性、上下文提供者或组件架构的任务。 许可证: MIT 元数据: 作者: vercel 版本: ‘1.0.0’
React组合模式
用于构建灵活、可维护的React组件的组合模式。通过使用复合组件、状态提升和组合内部结构，避免布尔属性泛滥。这些模式使代码库在扩展时更易于人类和AI代理操作。
何时应用
在以下情况下参考这些指南：
- 重构具有许多布尔属性的组件
- 构建可重用的组件库
- 设计灵活的组件API
- 评审组件架构
- 使用复合组件或上下文提供者
按优先级分类的规则类别
| 优先级 | 类别 | 影响 | 前缀 |
|---|---|---|---|
| 1 | 组件架构 | 高 | architecture- |
| 2 | 状态管理 | 中等 | state- |
| 3 | 实现模式 | 中等 | patterns- |
快速参考
1. 组件架构（高）
architecture-避免布尔属性- 不要添加布尔属性来自定义行为；使用组合architecture-复合组件- 使用共享上下文构建复杂组件
2. 状态管理（中等）
state-解耦实现- 提供者是唯一知道状态管理方式的地方state-上下文接口- 定义包含状态、操作、元数据的通用接口，用于依赖注入state-提升状态- 将状态移动到提供者组件中以供兄弟组件访问
3. 实现模式（中等）
patterns-显式变体- 创建显式变体组件，而不是布尔模式patterns-子组件优先于渲染属性- 使用子组件进行组合，而不是渲染X属性
如何使用
阅读单个规则文件以获取详细解释和代码示例：
规则/architecture-避免布尔属性.md
规则/state-上下文接口.md
每个规则文件包含：
- 为什么重要的简要解释
- 带解释的错误代码示例
- 带解释的正确代码示例
- 额外上下文和参考
完整编译文档
有关所有规则扩展的完整指南：AGENTS.md