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。 Dynamic Pages 通常用于教程等以减少样板代码。它只是导航的快捷方式。这样做的缺点是很难管理路线，因此应仅限于简短的教程。

3。 Generated Routes 不过还有第三种选择，我认为这是两者中最好的，那就是 Generated Routes。这是最干净、最容易维护的结构。关于它有一个很棒的教程 here。这是纲要：

声明路由：

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

声明你的路由器：

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}'),
                  ),
                ));
    }
  }
}

在main.dart

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

导航

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

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

Advantage from static routing to dynamic routing on Flutter

flutter

flutter-routes

1。静态路由

2。动态页面

问题