Flutter Action能否访问Riverpod？如何更新StateNotifier状态

问题描述 #

希望创建一个Action，让用户通过点击按钮或按下按键更新StateNotifier的状态（进而刷新UI），但实现Actions功能后，发现无法访问WidgetRef或ref来更新Provider。请问能否将Actions与Riverpod结合使用？是否需要将ref传入Action，这样做是否繁琐且违背设计初衷？

用户提供的代码示例：

class RemoveFileIntent extends Intent {
  const RemoveFileIntent();
}

class RemoveFileAction extends Action<RemoveFileIntent> {
  RemoveFileAction();

  @override
  Object? invoke(covariant RemoveFileIntent intent) {

    // update riverpod StateNotifier's state?

    return null;
  }
}

解决方案 #

1. 将WidgetRef传入Action（推荐方案） #

直接在Action的构造函数中接收WidgetRef，这是最直观且符合Flutter与Riverpod协作逻辑的方式，并不繁琐，也不违背设计初衷——Action作为交互逻辑的执行载体，需要访问状态管理工具来完成状态更新，完全符合单一职责原则。

修改后的Action代码：

class RemoveFileIntent extends Intent {
  const RemoveFileIntent();
}

class RemoveFileAction extends Action<RemoveFileIntent> {
  final WidgetRef ref;

  // 通过构造函数传入ref
  RemoveFileAction({required this.ref});

  @override
  Object? invoke(covariant RemoveFileIntent intent) {
    // 调用StateNotifier的方法更新状态（假设你的Provider是fileListProvider）
    ref.read(fileListProvider.notifier).removeFile();
    return null;
  }
}

2. 在Widget树中使用Action #

在Widget中创建Action实例时传入ref，并通过Actions组件绑定：

// 假设这是你的StateNotifier Provider
final fileListProvider = StateNotifierProvider<FileListNotifier, List<String>>((ref) {
  return FileListNotifier();
});

class FileListNotifier extends StateNotifier<List<String>> {
  FileListNotifier() : super([]);

  void removeFile() {
    if (state.isNotEmpty) {
      state = state.sublist(0, state.length - 1);
    }
  }
}

// 在Widget中使用
class FileOperationWidget extends ConsumerWidget {
  const FileOperationWidget({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Actions(
      actions: {
        RemoveFileIntent: RemoveFileAction(ref: ref),
      },
      child: Column(
        children: [
          ElevatedButton(
            onPressed: () {
              // 通过Actions.invoke触发Intent
              Actions.invoke(context, const RemoveFileIntent());
            },
            child: const Text('移除文件（点击按钮）'),
          ),
          const SizedBox(height: 16),
          Shortcuts(
            shortcuts: {
              // 绑定Delete快捷键
              LogicalKeySet(LogicalKeyboardKey.delete): const RemoveFileIntent(),
            },
            child: Focus(
              child: const Text('按Delete键移除文件'),
            ),
          ),
        ],
      ),
    );
  }
}

3. 全局Provider容器（适用于非Widget环境） #

如果Action需要在Widget树之外使用，可以通过ProviderContainer访问Provider，但这种方式仅推荐在非UI场景下使用：

// 全局容器示例（一般在main函数中初始化）
final container = ProviderContainer();

class RemoveFileAction extends Action<RemoveFileIntent> {
  @override
  Object? invoke(covariant RemoveFileIntent intent) {
    container.read(fileListProvider.notifier).removeFile();
    return null;
  }
}

总结 #

将ref传入Action是完全可行的方案，既不繁琐也不违背设计初衷。这种方式让Action专注于处理用户交互触发的逻辑，而状态更新则交给Riverpod的StateNotifier负责，完美契合两者的设计定位，是Flutter中交互与状态管理结合的常规实践。

内容的提问来源于stack exchange，提问作者mirkaim