AgentSkillsCN

react-ui-patterns

创建详尽的技术参考与API文档。生成全面的参数列表、配置指南，以及可搜索的参考资料。在API文档、配置参考，或完整技术规格的编写过程中，可主动选用此技能。

SKILL.md
--- frontmatter
version: 4.1.0-fractal
name: react-ui-patterns
description: Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.

React UI Patterns

Core Principles

  1. •Never show stale UI - Loading spinners only when actually loading
  2. •Always surface errors - Users must know when something fails
  3. •Optimistic updates - Make the UI feel instant
  4. •Progressive disclosure - Show content as it becomes available
  5. •Graceful degradation - Partial data is better than no data

Loading State Patterns

🧠 Knowledge Modules (Fractal Skills)

1. The Golden Rule

2. Loading State Decision Tree

3. Skeleton vs Spinner

4. The Error Handling Hierarchy

5. Always Show Errors

6. Error State Component Pattern

7. Button Loading State

8. Disable During Operations

9. Empty State Requirements

10. Contextual Empty States

11. Loading States

12. Error Handling

13. Button States