Flutter Riverpod新手技术问询：切换页面触发'setState() or markNeedsBuild() called during build.'异常

首先，咱们先拆解你遇到的核心问题：setState() or markNeedsBuild() called during build. 这个异常，本质是组件构建过程中触发了新的状态更新/重建请求，导致框架出现冲突。结合你的代码，问题根源和修复方案如下：

你的代码存在的问题 #

1. StateNotifier 状态更新时机错误 #

你在 NumericSettingNotifier 的 changeValue 方法里，错误地使用了 addPostFrameCallback 来延迟更新状态：

void changeValue(int newValue) => WidgetsBinding.instance! 
    .addPostFrameCallback((_) => state = NumericSetting(...));

这个回调会把状态更新推迟到当前帧构建完成后执行。当你在 SettingsView 修改设置后切回 VideoView，VideoView 开始重建时，之前延迟的状态更新可能刚好触发——此时 VideoView 的 build 方法还没执行完，新的状态变更又要求组件重建，直接触发了框架的冲突检测，抛出异常。

而且，StateNotifier 本身就是为同步状态更新设计的，Riverpod 会自动处理状态变更后的组件重建时机，完全不需要手动加这个回调。

2. VideoView 存在语法错误 #

你提供的 VideoView 代码里有两个 return 语句：

@override 
Widget build(BuildContext context, WidgetRef ref) { 
  final videoSettings = ref.watch(videoSettingsProvider); 
  return const Center(child: CircularProgressIndicator()); 
} 
return Container(); // 这个return永远不会执行，属于无效代码

虽然这个语法错误不会直接导致崩溃，但会让代码逻辑混乱，需要修正。

3. 临时方案的局限性 #

你用 AutomaticKeepAliveClientMixin 保留 VideoView 状态，确实能绕过重建冲突，但这只是“掩盖问题”而非“解决问题”——如果后续业务需要 VideoView 重建（比如依赖其他状态变更），这个问题还是会爆发。

正确的解决方式 #

1. 修复 StateNotifier 的状态更新逻辑 #

直接去掉 addPostFrameCallback，同步更新 StateNotifier 的状态：

class NumericSettingNotifier extends StateNotifier<NumericSetting> { 
  NumericSettingNotifier(NumericSetting state) : super(state); 

  void changeValue(int newValue) {
    // 直接同步更新状态，Riverpod会自动处理组件重建时机
    state = NumericSetting(
      value: newValue,
      minValue: state.minValue,
      maxValue: state.maxValue,
      defaultValue: state.defaultValue,
    );
  }
}

这样修改后，状态变更会立即生效，videoSettingsProvider 会同步重新计算组合后的设置，不会出现延迟更新与组件构建重叠的情况。

2. 修正 VideoView 的语法错误 #

删掉多余的 return Container();，确保 build 方法只有一个有效返回值：

class VideoView extends ConsumerWidget { 
  const VideoView({Key? key}) : super(key: key); 

  @override 
  Widget build(BuildContext context, WidgetRef ref) { 
    final videoSettings = ref.watch(videoSettingsProvider); 
    // 这里可以根据videoSettings渲染实际UI，比如进度条或视频组件
    return const Center(child: CircularProgressIndicator()); 
  } 
}

3. 确认子 Provider 的定义正确性 #

确保各个子设置 Provider（比如 qualitySettingProvider）是正确的 StateNotifierProvider，示例如下：

final qualitySettingProvider = StateNotifierProvider<NumericSettingNotifier, NumericSetting>((ref) {
  // 从SharedPreferences读取初始值
  final initialValue = ref.watch(spClientProvider).getValue(AppConstants.vidQuality, 50);
  return NumericSettingNotifier(NumericSetting(
    value: initialValue,
    minValue: 0,
    maxValue: 100,
    defaultValue: 50,
  ));
});

这样能保证状态变更的通知链是完整且及时的。

为什么这样能解决问题？ #

当你同步更新 StateNotifier 状态后：

1. 在 SettingsView 修改设置时，状态会立即更新，videoSettingsProvider 同步生成新的 VideoSetting 实例；
2. 切回 VideoView 时，页面重建会直接读取最新的 videoSettings 值，不会有延迟的状态变更触发额外的重建请求；
3. 框架能在正确的时机处理组件重建，不会出现“构建中触发重建”的冲突。

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