Flutter中Cubit切换语言后UI未更新问题排查

你遇到的语言切换后UI未更新的问题，主要由两个原因导致：

1. 状态类未实现相等性判断 #

ChangeLanguageState是普通自定义类，没有重写==运算符和hashCode方法。Cubit默认通过对象引用判断状态是否变化，虽然每次emit新对象会触发重建，但这种写法不规范，可能导致状态判断逻辑异常，同时也会产生不必要的UI重建。

修改语言状态类：
让ChangeLanguageState继承Equatable（需先在pubspec.yaml添加equatable依赖），确保Cubit能准确识别状态是否实际变化：

part of 'language_cubit.dart';

class ChangeLanguageState extends Equatable {
  const ChangeLanguageState({
    required this.locale,
  });
  final Locale locale;

  @override
  List<Object> get props => [locale];
}

2. 未同步EasyLocalization的Locale #

你使用了EasyLocalization库，UI中的.tr()翻译方法依赖于该库维护的Locale实例，而非仅MaterialApp的locale参数。当前仅更新Cubit状态和MaterialApp的locale，但没有通知EasyLocalization更新自身的Locale，导致翻译文本无法刷新。

修复步骤： #

（1）修改LanguageCubit，同步更新EasyLocalization并缓存语言设置

在changeLanguage方法中添加同步EasyLocalizationLocale和缓存语言的逻辑：

part 'language_state.dart';

class LanguageCubit extends Cubit<ChangeLanguageState> {
  LanguageCubit()
      : super(const ChangeLanguageState(
            locale: Locale(ApplicationConstants.DEFAULT_LANGUAGE.name, '')));

  Future<void> getSavedLanguage() async {
    final cachedLanguageCode = await LanguageCacheHelper().getCachedLanguage();
    final locale = Locale(cachedLanguageCode, '');
    emit(ChangeLanguageState(locale: locale));
  }

  Future<void> changeLanguage(String languageCode, BuildContext context) async {
    final locale = Locale(languageCode, '');
    // 同步EasyLocalization的Locale
    await context.setLocale(locale);
    // 缓存选中的语言
    await LanguageCacheHelper().cacheLanguage(languageCode);
    emit(ChangeLanguageState(locale: locale));
  }
}

（2）更新HomeView的按钮点击逻辑

传递context给changeLanguage方法：

ElevatedButton(
  onPressed: () {
    context.read<LanguageCubit>().changeLanguage(LANGUAGE.tr.name, context);
  },
  child: Text(LocaleKeys.tr_lang.tr()),
),
ElevatedButton(
  onPressed: () {
    context.read<LanguageCubit>().changeLanguage(LANGUAGE.en.name, context);
  },
  child: Text(LocaleKeys.en_lang.tr()),
),

（3）在MyApp中确保Locale同步

在MyApp的Builder中，监听LanguageCubit状态变化时同步EasyLocalization的Locale，避免初始化或状态恢复时出现不一致：

builder: (context) {
  final languageCubit = context.watch<LanguageCubit>();
  final themeCubit = context.watch<ThemeCubit>();

  // 同步EasyLocalization与Cubit的Locale
  if (context.locale != languageCubit.state.locale) {
    context.setLocale(languageCubit.state.locale);
  }

  return MaterialApp.router(
    routeInformationParser: appRouter.defaultRouteParser(),
    routerDelegate: appRouter.delegate(),
    localizationsDelegates: context.localizationDelegates,
    supportedLocales: context.supportedLocales,
    locale: languageCubit.state.locale,
    theme: themeCubit.state.themeData,
    debugShowCheckedModeBanner: false,
    builder: CustomResponsive.build,
  );
},

完成以上修改后，语言切换时Cubit状态变化会正确触发UI重建，同时EasyLocalization的翻译文本也会同步更新。

内容的提问来源于stack exchange，提问作者M.Akyuzlu