导航到另一个页面后,底部导航栏消失,GoRouter

所以我想使用GoRouter从一个页面导航到另一个页面,因为我正在使用flutter开发一个网站,我希望URL在从一个网页导航到另另一个网页时发生变化。但是我遇到了一个问题,因为我想使用选项卡。我决定使用BottomNavigatorBar,因为我知道它,但当我登录后导航到除第一个(默认)页面之外的任何其他页面时,整个BottomNavigationBar都会消失。我不知道为什么。这是我的主页代码。

class HomePage extends StatefulWidget {

  HomePage({Key? key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<Recipe> recipes = [];
  bool dataFetched = false;
  User? user;
  PageController _pageController = PageController();

  int _selectedIndex = 0;

  final List<String> _routeNames = [
    MyAppRouteConstants.profileRouteName,
    MyAppRouteConstants.addRecipeRouteName,
    MyAppRouteConstants.publicRecipeRouteName,
    MyAppRouteConstants.favoritesRouteName
  ];

  String? getToken() {
    return html.window.localStorage['token'];
  }

  @override
  void initState() {
    super.initState();
    fetchAndSetUser();
    fetchAndSetRecipes();
  }

  void fetchAndSetUser() async{
    String? token = getToken();

    user = await fetchUserData(token!);
  }

  Future<void> fetchAndSetRecipes() async {
    try {
      String? token = getToken();
      if (token != null) {
        List<Map<String, dynamic>> fetchedRecipeData = await fetchRecipeData(token);

        List<Recipe> fetchedRecipes = [];
        for (Map<String, dynamic> recipeMap in fetchedRecipeData) {
          Recipe recipe = Recipe.fromJson(recipeMap);
          fetchedRecipes.add(recipe);
        }
        setState(() {
          recipes = fetchedRecipes;
          dataFetched = true;
        });
      } else {
        print('Token is missing. Please log in.');
      }
    } catch (e) {
      print('Error fetching recipes: $e');
    }
  }

  Future<void> refreshRecipes() async {
    await fetchAndSetRecipes();
  }

  Widget _buildPage(int index) {
    switch (index) {
      case 0:
        return ProfilePage();
      case 1:
        return CreateActivityPage();
      case 2:
        return PublicRecipePage();
      case 3:
        return FavoritesPage();
      default:
        return UnknownPage();
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
        controller: _pageController,
        children: [
          ProfilePage(),
          CreateActivityPage(),
          PublicRecipePage(),
          FavoritesPage(),
        ],
        onPageChanged: (index) {
          setState(() {
            _selectedIndex = index;
          });
          _updateUrl(index);
        },
      ),
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _selectedIndex,
        onTap: (index) {
          setState(() {
            _selectedIndex = index;
          });
          _pageController.animateToPage(
            index,
            duration: Duration(milliseconds: 500),
            curve: Curves.ease,
          );
          _updateUrl(index);
        },
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.person), label: 'Profile'),
          BottomNavigationBarItem(icon: Icon(Icons.add), label: 'Add Recipe'),
          BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Public Recipes'),
          BottomNavigationBarItem(icon: Icon(Icons.favorite), label: 'Favorites'),
        ],
      ),
    );
  }

  void _updateUrl(int index) {
    final routeName = _routeNames[index];
    GoRouter.of(context).goNamed(routeName);
  }
}

我的GoRouter是这样的

class MyAppRouter{

  GoRouter router = GoRouter(

    routes: [
      GoRoute(
          name: MyAppRouteConstants.defaultRouteName,
          path: '/',
          pageBuilder: (context, state){
            return MaterialPage(child: UnknownPage());
          }
      ),
      GoRoute(
        name: MyAppRouteConstants.registerRouteName,
        path: '/register',
        pageBuilder: (context, state){
          return MaterialPage(child: RegisterPage());
        }
      ),
      GoRoute(
          name: MyAppRouteConstants.loginRouteName,
          path: '/login',
          pageBuilder: (context, state){
            return MaterialPage(child: LogInPage());
          }
      ),
      GoRoute(
          name: MyAppRouteConstants.profileRouteName,
          path: '/profile_page',
          pageBuilder: (context, state){
            return MaterialPage(child: HomePage());
          }
      ),
      GoRoute(
          name: MyAppRouteConstants.addRecipeRouteName,
          path: '/add_recipe',
          pageBuilder: (context, state){
            return MaterialPage(child: CreateActivityPage());
          }
      ),
      GoRoute(
          name: MyAppRouteConstants.publicRecipeRouteName,
          path: '/public_recipes',
          pageBuilder: (context, state){
            return MaterialPage(child: PublicRecipePage());
          }
      ),
      GoRoute(
          name: MyAppRouteConstants.favoritesRouteName,
          path: '/favorites',
          pageBuilder: (context, state){
            return MaterialPage(child: FavoritesPage());
          }
      ),
    ],
    errorPageBuilder: (context, state){
      return MaterialPage(child: UnknownPage());
    }

  );
}

class MyAppRouteConstants{
  static const String defaultRouteName = 'default';
  static const String registerRouteName = 'register';
  static const String loginRouteName = 'login';
  static const String profileRouteName = 'profile_page';
  static const String addRecipeRouteName = 'add_recipe';
  static const String publicRecipeRouteName = 'public_recipes';
  static const String favoritesRouteName = 'favorites';

  static final Map<String, GlobalKey<NavigatorState>> tabNavigatorKeys = {
    profileRouteName: GlobalKey<NavigatorState>(),
    addRecipeRouteName: GlobalKey<NavigatorState>(),
    publicRecipeRouteName: GlobalKey<NavigatorState>(),
    favoritesRouteName: GlobalKey<NavigatorState>(),
  };
}

登录主页打开后立即打开ProfilePage。我在BottomNavigationBar可以导航到的任何页面中都没有任何特殊代码,我不知道是否需要。我只想更改网址,并了解GoRouter。

我试过查找教程,但我不太了解,我也试过使用TabView,但没有成功。

如果你有任何修复,请提供它们,或者如果有更简单的方法来完成导航部分,我只想使用选项卡,当选项卡更改时,URL也会更改。谢谢