如何修复多个小部件使用相同的 GlobalKey

Question

这是我的示例存储库。 我使用 IntellJ IDEA，并在我的 Android 手机上运行它。 第一次跑没问题。 再次点击运行按钮，日志中将显示

Multiple widgets used the same GlobalKey

。

我如何解决它。感谢您的帮助。

• 部分错误日志，完整日志在我的仓库的自述文件中

======== Exception caught by widgets library =======================================================
The following assertion was thrown while finalizing the widget tree:
Multiple widgets used the same GlobalKey.

The key [GlobalObjectKey int#371bd] was used by multiple widgets. The parents of those widgets were different widgets that both had the following description:
  IndexPage
A GlobalKey can only be specified on one widget at a time in the widget tree.
When the exception was thrown, this was the stack: 
#0      BuildOwner._debugVerifyGlobalKeyReservation.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:flutter/src/widgets/framework.dart:3205:13)
#1      _LinkedHashMapMixin.forEach (dart:collection-patch/compact_hash.dart:633:13)
#2      BuildOwner._debugVerifyGlobalKeyReservation.<anonymous closure>.<anonymous closure> (package:flutter/src/widgets/framework.dart:3149:20)
#3      _LinkedHashMapMixin.forEach (dart:collection-patch/compact_hash.dart:633:13)
#4      BuildOwner._debugVerifyGlobalKeyReservation.<anonymous closure> (package:flutter/src/widgets/framework.dart:3144:36)
#5      BuildOwner._debugVerifyGlobalKeyReservation (package:flutter/src/widgets/framework.dart:3213:6)
#6      BuildOwner.finalizeTree.<anonymous closure> (package:flutter/src/widgets/framework.dart:3267:11)
#7      BuildOwner.finalizeTree (package:flutter/src/widgets/framework.dart:3342:8)
#8      WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:1169:19)
#9      RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:468:5)
#10     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1397:15)
#11     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1318:9)
#12     SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:1040:9)
#13     PlatformDispatcher.scheduleWarmUpFrame.<anonymous closure> (dart:ui/platform_dispatcher.dart:837:16)
#17     _RawReceivePort._handleMessage (dart:isolate-patch/isolate_patch.dart:184:12)
(elided 3 frames from class _Timer and dart:async-patch)
====================================================================================================

• 路由器代码

final rootKey = GlobalKey<NavigatorState>();
final _shellKey = GlobalKey<NavigatorState>(debugLabel: "index");

@TypedShellRoute<IndexRoute>(
  routes: <TypedRoute<RouteData>>[
    TypedGoRoute<FirstRoute>(
      path: "/",
    ),
    TypedGoRoute<SecondRoute>(
      path: "/second",
    ),
  ],
)
class IndexRoute extends ShellRouteData {
  static final GlobalKey<NavigatorState> $navigatorKey = _shellKey;

  @override
  Widget builder(BuildContext context, GoRouterState state, Widget navigator) {
    return IndexPage(child: navigator);
  }
}

class FirstRoute extends GoRouteData {
  @override
  Page<void> buildPage(BuildContext context, GoRouterState state) {
    return const NoTransitionPage(child: FirstScreen());
  }
}

class SecondRoute extends GoRouteData {
  @override
  Page<void> buildPage(BuildContext context, GoRouterState state) {
    return const NoTransitionPage(child: SecondScreen());
  }
}

• 主应用程序

class App extends StatelessWidget {
  const App({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerConfig: GoRouter(
        initialLocation: "/",
        routes: $appRoutes,
        navigatorKey: rootKey,
        redirect: (context, state) {
          return null;
        },
      ),
    );
  }
}

• 环境。

flutter doctor -v
[✓] Flutter (Channel stable, 3.24.3, on macOS 14.6.1 23G93 darwin-arm64, locale zh-Hant-TW)
    • Flutter version 3.24.3 on channel stable at /Users/...
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 2663184aa7 (5 weeks ago), 2024-09-11 16:27:48 -0500
    • Engine revision 36335019a8
    • Dart version 3.5.3
    • DevTools version 2.37.3

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/...
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/...
    • ANDROID_SDK_ROOT = /Users/...
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105)
    • All Android licenses accepted.

[✓] IntelliJ IDEA Community Edition (version 2024.1.6)
    • IntelliJ at /Users/mosil/Applications/IntelliJ IDEA Community Edition 2024.1.6.app
    • Flutter plugin version 82.0.2
    • Dart plugin version 241.18968.26

[✓] Connected device
    • Pixel 4 (mobile)                • 98171FFAZ0038F            • android-arm64  • Android 13 (API 33)

我使用IntellJ IDEA，并在我的Android手机上运行它。 第一次跑没问题。 再次点击运行按钮，日志中将显示

Multiple widgets used the same GlobalKey

。

Answer 1

我找到了需要修改的地方 ShellRoute 中的两个子部件 FirestRouteData 和 SecondRouteData 应包含在 IndexRouteData 中。 因此，在使用时，应该直接使用build函数，而不是buildPage函数，如：

class FirstRouteData extends GoRouteData {
  const FirstRouteData();

  // static final GlobalKey<NavigatorState> $parentNavigatorKey = shellKey;
  @override
  Widget build(BuildContext context, GoRouterState state) {
    return const FirstScreen();
  }
}

Multiple widgets used the same GlobalKey

的问题应该是buildPage导致的。看看网上有没有朋友有更明确的意见。