Flutter中GetX更新Locale导致GoRouter导航栈重置问题排查

调用Get.updateLocale()后，GetX会触发GetMaterialApp的重建。由于你使用的是静态创建的GoRouter实例，GetMaterialApp.router重建时会复用该实例，而GoRouter默认会在初始化阶段导航到initialLocation，导致原有导航栈被重置回初始路由。

通过让GoRouter监听GetX的locale变化，仅刷新当前页面而非重置路由栈来解决问题：

1. 创建Locale监听类 #

实现一个ChangeNotifier子类，订阅GetX的locale变化流：

class LocaleListenable extends ChangeNotifier {
  LocaleListenable() {
    Get.localeStream.listen((_) => notifyListeners());
  }
}

2. 修改GoRouter配置 #

将上述监听类作为refreshListenable传入GoRouter，确保locale变化时仅刷新当前路由页面，而非重置整个导航栈：

final rootNavigatorKey = GlobalKey<NavigatorState>();

class AppRouter {
  static final _shellNavigatorKey = GlobalKey<NavigatorState>();
  static final _localeListenable = LocaleListenable();

  static final router = GoRouter(
    initialLocation: IntroView.path,
    debugLogDiagnostics: true,
    navigatorKey: rootNavigatorKey,
    refreshListenable: _localeListenable,
    routes: [
      ShellRoute(
        navigatorKey: _shellNavigatorKey,
        pageBuilder: (context, state, child) {
          return NoTransitionPage(
            child: ScaffoldView(child: child),
          );
        },
        routes: [
          GoRoute(
            name: ProjectsView.name,
            path: '/projects',
            parentNavigatorKey: _shellNavigatorKey,
            pageBuilder: (context, state) {
              return const FadePageTransition(page: ProjectsView());
            },
            routes: [
              GoRoute(
                parentNavigatorKey: rootNavigatorKey,
                path: ':projectTitle',
                pageBuilder: (context, state) {
                  return FadePageTransition(
                    page: ProjectDetailScaffold(
                      project: Projects.values.byName(state.params['projectTitle']!),
                    ),
                  );
                },
              ),
            ],
          ),
          // 其他路由配置...
        ],
      ),
    ],
  );
}

3. 调整GetMaterialApp配置 #

将locale属性改为绑定Get.locale，确保GetX的locale状态与MaterialApp同步：

class App extends StatelessWidget {
  final GoRouter router;
  const App({super.key, required this.router});

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        // 你的其他Provider配置...
      ],
      child: GetMaterialApp.router(
        routeInformationProvider: router.routeInformationProvider,
        routeInformationParser: router.routeInformationParser,
        routerDelegate: router.routerDelegate,
        translationsKeys: translationsKeys,
        locale: Get.locale,
        fallbackLocale: const Locale(LocaleConfiguration.baseLanguageCode),
      ),
    );
  }
}

额外注意事项 #

• 确保页面组件使用GetX的tr()方法获取翻译文本，这样locale更新时页面内容会自动刷新。
• 避免在Get.updateLocale()之后手动调用导航方法，防止意外重置路由栈。

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