mcpField
R
riverpod-containers

riverpod-containers

github.com/serverpod开发1073 次安装34 周前更新
代码仓库

关于 riverpod-containers

此 Riverpod 技能介绍如何在 Flutter 应用、Dart 代码和测试中通过 ProviderContainer 与 ProviderScope 管理状态,并说明状态隔离、配置和作用域覆盖。

主要功能

  1. 01在 Flutter 中配置 ProviderScope
  2. 02在 Dart 中使用 ProviderContainer
  3. 03为测试创建独立容器
  4. 04设置覆盖项与观察器
  5. 05了解 Provider 作用域

适用场景

  1. 01在 Flutter 应用中设置 Riverpod 状态
  2. 02在命令行或服务端 Dart 中管理 Provider
  3. 03隔离各测试的状态
  4. 04为子树应用 Provider 覆盖项

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/serverpod/skills-registry --skill riverpod-containers

安装后在 Claude Code 中输入/riverpod-containers确认已加载。

详细介绍

Riverpod — 容器 / 作用域

说明

Provider 本身不持有状态。状态存储在 ProviderContainer 中。在 Flutter 中,使用 ProviderScope widget,它会创建一个容器并将其提供给 widget 树。

Flutter:ProviderScope

在根部包裹应用,以便 widget 可以读取 providers:

void main() {
  runApp(
    ProviderScope(
      child: MyApp(),
    ),
  );
}

之后,使用 Consumer / ConsumerWidget / ConsumerStatefulWidget 获取 ref,并调用 ref.watch / ref.read。也可以向 ProviderScope 传递 overrides 或 observers。

纯 Dart:ProviderContainer

在命令行或服务端 Dart 中,创建一个容器,使用后再将其销毁:

void main() {
  final container = ProviderContainer();
  try {
    final sub = container.listen(counterProvider, (previous, next) {
      print('Counter changed from $previous to $next');
    });
    print('Counter starts at ${sub.read()}');
  } finally {
    container.dispose();
  }
}
为什么状态存储在容器中
  • 职责分离 — 只有 provider(以及 ref)可以更改其状态;UI 通常会调用 notifier 方法。
  • 测试 — 每个测试都可以创建一个新容器(例如 ProviderContainer.test()),以获得全新的状态;不会共享全局状态。
  • 配置 — Overrides 和 observers 在容器 / 作用域上设置。参见 riverpod-overrides 和 riverpod-observers。
  • 作用域 — 同一个 provider 在树的不同部分可以解析为不同状态(高级用法)。参见 riverpod-scoping。
测试

不要在测试中直接使用 ProviderContainer()。使用 ProviderContainer.test(),这样测试结束时容器会被销毁:

test('Counter starts at 0 and can be incremented', () {
  final container = ProviderContainer.test();
  expect(container.read(counterProvider), 0);
  container.read(counterProvider.notifier).increment();
  expect(container.read(counterProvider), 1);
});

在 widget 测试中,将 widget 包裹在 ProviderScope 中;如有需要,可使用 tester.container() 获取容器(参见 riverpod-testing)。

评论

支持 Markdown