Flutter 上从静态路由到动态路由的优势

Question

我可以看到该MaterialApp应用程序可以接收路线。

1.静态路由

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      routes: {
        '/page1': (context) => Page1(title: "Main page"),
...

并从小部件显示它们，例如：

myKey.currentState.pushNamed("/page1");

还有其他参数，例如onGenerateRoute和initialRoute使我更加困惑。

2. 动态页面

onPressed: () {
  Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
  );
}

题

我想知道这是什么参数的含义，让这个“责任”的MaterialApp，为什么我们应该这样做，或许真的与内存管理或如何在Widget生命周期内的作品，还是什么？

1. 和 2. 之间有什么区别？

Answer 1

答案更多地在于您的架构。

1.在管理项目复杂性方面，静态路由是两者中更好的。明确定义了路线供多个开发人员理解，导航代码更容易，Navigator.of(context).pushNamed('your-route');vs

Navigator.push(
   context,
   MaterialPageRoute(builder: (context) => SecondRoute()),
 );

2. 动态页面通常在教程中使用，以减少样板代码。它只是导航的快捷方式。这样做的缺点是很难管理路线，因此应该仅限于简短的教程。

3. Generated Routes虽然还有第三种选择，在我看来这是两者中最好的，那就是 Generated Routes。这是最干净和最容易维护的结构。有一个伟大的教程在这里了。这是纲要：

1. 声明路线：

class RoutePaths {
  static const Start = '/';
  static const SecondScreen = 'second'
}

2. 声明你的路由器：

class Router {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case RoutePaths.Start:
        return MaterialPageRoute(builder: (_) => YourFirstScreenWidget());

      case RoutePaths.SecondScreen:
        // you can do things like pass arguments to screens
        final event = settings.arguments as Event;
        return MaterialPageRoute(
            builder: (_) => YourSecondScreenWidget(event: event));

      default:
        return MaterialPageRoute(
            builder: (_) => Scaffold(
                  body: Center(
                    child: Text('No route defined for ${settings.name}'),
                  ),
                ));
    }
  }
}

3. 在 main.dart 中声明

initialRoute: RoutePaths.Start,
onGenerateRoute: Router.generateRoute,

4. 导航

// arguments: event is an optional parameter to send to secondScreen
Navigator.of(context).pushNamed(RoutePaths.SecondScreen, arguments: event);