Flutter基础之路由详解，带您轻松掌握路由机制

Flutter中管理多个页面时有两个核心概念和类：Route和Navigator。一个route是一个屏幕或页面的抽象，Navigator是一个管理route的类。Navigator可以将route压入或弹出栈中，从而实现页面的跳转和返回。

路由导航

Flutter中，可以通过Navigator.push()方法来跳转到新的页面。Navigator.push()方法接收一个Route对象作为参数，该Route对象指定了要跳转到的页面。例如，以下代码将跳转到一个新的页面，该页面显示“Hello, World!”：

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => Scaffold(
      appBar: AppBar(
        title: Text('Hello, World!'),
      ),
      body: Center(
        child: Text('Hello, World!'),
      ),
    ),
  ),
);

可以通过Navigator.pop()方法来返回到上一个页面。Navigator.pop()方法接收一个结果作为参数，该结果将被传递给上一个页面的回调函数。例如，以下代码将返回到上一个页面，并将“Hello, World!”作为结果传递给上一个页面的回调函数：

Navigator.pop(context, 'Hello, World!');

路由传值

Flutter中，可以通过RouteSettings对象来传递参数。RouteSettings对象包含一个name属性和一个arguments属性。name属性指定了页面的名称，arguments属性指定了要传递的参数。例如，以下代码将跳转到一个新的页面，并将“Hello, World!”作为参数传递给该页面：

Navigator.push(
  context,
  MaterialPageRoute(
    settings: RouteSettings(
      name: '/hello',
      arguments: 'Hello, World!',
    ),
    builder: (context) => Scaffold(
      appBar: AppBar(
        title: Text('Hello, World!'),
      ),
      body: Center(
        child: Text(ModalRoute.of(context)!.settings.arguments as String),
      ),
    ),
  ),
);

在新的页面中，可以通过ModalRoute.of(context)!.settings.arguments来获取传递过来的参数。例如，以下代码将获取传递过来的参数并将其显示在屏幕上：

Text(ModalRoute.of(context)!.settings.arguments as String),

总结

本文详细讲解了Flutter中的路由机制，包括路由导航和路由传值两个方面。通过Navigator.push()方法可以跳转到新的页面，通过Navigator.pop()方法可以返回到上一个页面。通过RouteSettings对象可以传递参数，在新的页面中可以通过ModalRoute.of(context)!.settings.arguments来获取传递过来的参数。