zl程序教程

您现在的位置是:首页 >  工具

当前栏目

Flutter路由跳转方式

路由flutter 方式 跳转
2023-09-27 14:27:34 时间
1、通过of跳转
//在入口定义路由
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo', //应用名
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Hello Flutter'),
      //定义路由
      routes: <String,WidgetBuilder>{
          "/basicComponent":(BuildContext context)=>const BasicComponent(),  //通过of跳转使用定义的路由名
      },
    );
  }
}

//路由跳转
Navigator.of(context).pushNamed("/basicComponent");
2、通过push跳转
  • 不带参数
Navigator.push(context, MaterialPageRoute(builder: (context)=>const BasicComponent()));
//或
Navigator.push(context,MaterialPageRoute(builder: (context) {
		return const BasicComponent();
}));
3、传递参数
  • 带有参数(单个参数&#