Suspense 统一了异步 UI 状态管理,但需要数据层协作。
核心概念
- 资源读取需要抛出 Promise,配合 Suspense 边界显示占位。
- ErrorBoundary 管理错误 fallback,保证用户体验。
- 结合第三方库(React Query/SWR)可直接使用 Suspense。
实战步骤
- 封装资源工厂:
createResource(asyncFn)返回 read API。 - 按页面拆分 Suspense 边界,减少全局 loading 闪烁。
- 用
startTransition区分优先级,避免阻塞输入。
2000/2/18小于 1 分钟