状态变更成功后Bloc未重建Widget问题排查

核心问题 #

• 你在StatelessWidget的build方法里定义了局部变量name，每次build执行时都会重新初始化它为'Nombre'——哪怕你在listener里修改了这个变量，也不会触发build重新执行，而且下次build时变量又会被重置。
• BlocConsumer的listener是用来处理副作用（比如弹窗、导航、日志）的，不是用来更新UI状态的，UI的更新逻辑应该放在builder中，直接从当前state读取数据。

修复后的代码 #

class _NameText extends StatelessWidget {
  const _NameText({Key? key}) : super(key: key);  

  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: Alignment.centerLeft,
      child: BlocConsumer<AdPreviewBloc, AdPreviewState>(
        // listener仅保留副作用逻辑，比如日志
        listener: (context, state) {
          if (state is AdPreviewChangeState && state.id == 'name') {
            print(state.text);
          }
        },
        builder: (context, state) {
          // 直接从当前state中获取文本，无匹配状态时用默认值
          String name = 'Nombre';
          if (state is AdPreviewChangeState && state.id == 'name') {
            name = state.text;
          }
          return Container(
            margin: EdgeInsets.only(top: ScreenUtils.percentHeight(context, .3)),
            width: ScreenUtils.percentWidth(context, 11),
            height: ScreenUtils.percentHeight(context, 3.5),
            child: Text(
              name,
              style: TextStyle(
                fontFamily: 'SF Pro',
                fontWeight: FontWeight.w700,
                fontSize: 24,
                color: Color(0xff525252),
              ),
              overflow: TextOverflow.ellipsis,
            ),
          );
        },
      ),
    );
  }
}

额外优化建议 #

如果你的AdPreviewState包含多种状态类型，建议用when方法（需依赖bloc包）来更清晰地处理不同状态：

builder: (context, state) {
  String name = state.when(
    initial: () => 'Nombre',
    changeState: (id, text) => id == 'name' ? text : 'Nombre',
    // 补充其他状态类型的处理逻辑
  );
  // ... 后续UI代码
}

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