!!!译文为作者本人人肉翻译~转载请注明出处!!!
pub:riverpod | Dart Package (flutter-io.cn)
译时版本: 2.4.5
之前翻译过 Riverpod 的官方文档,现在随着版本更新,官方文档又多了很多新内容,所以再补充翻译一下。
之前翻译过的内容,现在官方文档有中文了。
Flutter状态管理库Riverpod官方文档翻译汇总 - 掘金 (juejin.cn)
为什么是 Riverpod ?
Riverpod 是什么?
Riverpod (Provider的变形单词(字母换了位置))是用于 Flutter/Dart 的响应式缓存框架。
使用声明式和响应式的编程方式,Riverpod 会为你接管应用的很大部分逻辑。 有自动重新获取数据的必须时,可以使用内置错误和缓存发起网络请求。
初心
现代应用很少带有渲染 UI 的所有必要信息。
取而代之的是,数据常会从服务器异步获取。
问题是,异步的代码运行比较复杂。
尽管 Flutter 自带在变化发生时创建状态变量和刷新UI时时的一些处理方式,但是仍然非常受限。
一些挑战仍未解决:
- 异步请求需要缓存到本地,无论何时 UI 更新都不需要重新执行。
- 有缓存,但是缓存可能会在没有意识到过期时已经过期了。
- 需要处理错误和加载中的状态。
要一下子解决这些问题还是比较困难,因为这些问题会受到很多特性的影响,例如:
- 下拉刷新
- 无限列表 / 滚动时获取数据
- 输入时查询
- 异步请求防抖
- 不再使用时取消异步请求
- 积极的界面更新
- 离线模式offline mode
- ...
这些特性实现起来比较困难,但对于好的用户体验来说是重要的。 已经有一些包尝试直接解决这些问题,但是还是需要大量的手动工作。
这就是 Riverpod 想要解决的问题。
受 Flutter 组件启发,Riverpod 提供了编写业务逻辑的唯一方式来尝试解决这些问题。
在很多方面 Riverpod 都可以比作组件,只不过它是用于状态管理的。
用这种崭新的方式,上面这些复杂的特性大部分已经被实现了。剩下需要做的就是专注 UI 。
表示怀疑?这里有个示例。下面的代码片段是使用 RiverPod 实现的 Pub.dev 客户端应用的简化版。
// 从 pub.dev 获取包列表
@riverpod
Future<List<Package>> fetchPackages(
FetchPackagesRef ref, {
required int page,
String search = '',
}) async {
final dio = Dio();
// 访问 API 。在这里使用 package:dio ,当然可以使用其它任何网络请求包。
final response = await dio.get<List<Object?>>(
'https://pub.dartlang.org/api/search?page=$page&q=${Uri.encodeQueryComponent(search)}',
);
// 将 JSON 响应解码为 Dart 类。
return response.data?.map(Package.fromJson).toList() ?? const [];
}
This snippet is all the business logic you need for a "search as we type" + "pull to refresh" + "infinite list", while handling error/loading states.
该代码片段是处理错误和加载中状态时,用于 “输入时查询” 和 “下拉刷新” 和 “无限列表” 的所有业务逻辑,