Flutter中使用easy_localization无法全局翻译应用的问题求助

问题根源 #

1. const修饰的首页阻止重建：你在MyApp中设置home: const MyHomePage，当locale变化时，const组件不会重新构建，导致首页翻译无法更新。
2. 页面未监听locale状态变化：部分页面未正确依赖locale状态，无法感知语言切换事件。

修复步骤 #

1. 移除首页的const修饰 #

修改MyApp的home属性，去掉const关键字：

home: MyHomePage(title: 'Flutter Demo Home Page'),

这样当locale变化触发MyApp重建时，首页会重新加载新语言的翻译。

2. 确保MaterialApp响应locale更新 #

在MyApp的build方法中显式获取当前locale，确保状态变化时触发MaterialApp重建：

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

  @override
  Widget build(BuildContext context) {
    final currentLocale = context.locale;
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(primarySwatch: Colors.blue),
      localizationsDelegates: context.localizationDelegates,
      supportedLocales: context.supportedLocales,
      locale: currentLocale,
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

3. 规范语言切换代码 #

使用context.setLocale()替代直接赋值context.locale，确保全局状态正确更新：

onChanged: (Locale? newValue) {
  if (newValue != null) {
    context.setLocale(newValue);
    setState(() => lang = newValue);
  }
}

4. 避免缓存翻译文本 #

不要在initState或全局变量中缓存.tr()的结果，必须在build方法中直接调用：

// 正确写法
Text("hello".tr());

// 错误写法（不会随语言切换更新）
String? cachedText;
@override
void initState() {
  super.initState();
  cachedText = "hello".tr();
}

5. 验证语言文件配置 #

确认pubspec.yaml中正确声明了语言文件路径：

flutter:
  assets:
    - assets/languages/

同时确保assets/languages下的en.json和ar.json格式正确，示例：

• en.json: {"hello": "Hello", "Language": "Language"}
• ar.json: {"hello": "مرحبا", "Language": "اللغة"}

测试验证 #

修改完成后重新运行应用，切换语言后跳转至其他页面，检查翻译是否正常显示。

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