首页 > 解决方案 > router onRouteGenerated:仅在子小部件中,而不是在材质应用小部件中设置

问题描述

我想要一个底部导航栏并使用命名路由(主要用于颤振网络)。

因此,我总是需要标签栏脚手架作为基础,并有一个导航器小部件作为其内容的主体。这工作正常。问题是,如果我移动到第二个选项卡并在 Flutter Web 中重新加载应用程序,我会收到以下错误消息:

══╡ EXCEPTION CAUGHT BY FLUTTER FRAMEWORK ╞═════════════════════════════════════════════════════════
The following message was thrown:
Could not navigate to initial route.
The requested route name was: "/2"
There was no corresponding route in the app, and therefore the initial route specified will be
ignored and "/" will be used instead.

我知道,我收到此错误消息是因为在材料应用程序级别上没有指定路由/onRouteGenerated。但我不想在那里指定它,因为我总是需要 TabBarWidget 并且不想用不同的小部件替换它,而是想显示其中的内容。

因此问题是:是否可以将 onRouteGenerated 的“调用”委托给子导航器,即 tabBarWidget 主体中的导航器?还是有更好的解决方案?

示例代码:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';


void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  // This widget is the root of your application.
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        DefaultMaterialLocalizations.delegate,
        DefaultCupertinoLocalizations.delegate
      ],
      home: TabBarWidget(),
    );
  }
}

class TabBarWidget extends StatefulWidget {
  @override
  TabBarWidgetState createState() => TabBarWidgetState();
}

class TabBarWidgetState extends State<TabBarWidget> {

  int currentIndex = 0;
  final _navigatorKey = GlobalKey<NavigatorState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: CupertinoTabBar(
        currentIndex: currentIndex,
        onTap: (number) => _itemChanged(number),
        items: [
          BottomNavigationBarItem(
              icon: Icon(CupertinoIcons.mail), title: Text("1")),
          BottomNavigationBarItem(
              icon: Icon(CupertinoIcons.mail), title: Text("2")),
        ],
      ),
      body: Navigator(
        key: _navigatorKey,
        initialRoute: "/1",
        onGenerateRoute: RouteGenerator.generateRoute,
      ),
    );
  }


  _itemChanged(int number) {
    currentIndex = number;
    setState(() {});

    String path;

    switch (number) {
      case 0:
        path = "/1";
        break;
      case 1:
        path = "/2";
        break;
      default:
        path  = "/1";
        break;
    }
    _navigatorKey.currentState.pushReplacementNamed(path);
  }
}

class RouteGenerator {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/1':
        return MaterialPageRoute(builder: (_) => ScreenOne(), settings: settings);
      case '/2':
        return MaterialPageRoute(builder: (_) => ScreenTwo(), settings: settings);
      default:
        return _errorRoute();
    }
  }

  static Route<dynamic> _errorRoute() {
    return MaterialPageRoute(builder: (_) {
      return Scaffold(
        appBar: AppBar(
          title: Text('Error'),
        ),
        body: Center(
          child: Text('ERROR'),
        ),
      );
    });
  }
}

class ScreenOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.red,
    );
  }
}

class ScreenTwo extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.yellow,
    );
  }

}

标签: flutter

解决方案


推荐阅读