Flutter 路由介绍

Flutter中的路由通俗的讲就是页面跳转。在Flutter中通过Navigator组件管理路由导航。
并提供了管理堆栈的方法。如:Navigator.push和Navigator.pop
Flutter中给我们提供了两种配置路由跳转的方式:1、基本路由 2、命名路由

Flutter 中的基本路由使用

想从HomePage组件跳转到SearchPage组件

1、需要在HomPage中引入SearchPage.dart

import '../search.dart';

2、在HomePage中通过下面方法跳转

class HomePage extends StatefulWidget {
const HomePage({super.key}); @override
State<HomePage> createState() => _nameState();
} // ignore: camel_case_types
class _nameState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Column(
children: [
ElevatedButton(onPressed: (){
Navigator.of(context).push(
MaterialPageRoute(builder:
(BuildContext context){
return SearchPage();
}
)
);
}, child: const Text("跳转页面"))
],
);
}
}

Flutter 中的普通路由跳转传值

1、传值
class HomePage extends StatefulWidget {
const HomePage({super.key});
@override
State<HomePage> createState() => _nameState();
}
// ignore: camel_case_types
class _nameState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Column(
children: [
ElevatedButton(onPressed: (){
Navigator.of(context).push(
MaterialPageRoute(builder:
(BuildContext context){
return const SearchApp(title: "传的参数",Id: 12,); //传参
} )
);
}, child: const Text("跳转传值"))
],
); }}
2、跳转页面后收参
//接受上个页面传的参数
class SearchApp extends StatefulWidget { final String title;
final int Id;
const SearchApp({super.key,this.title="默认值", required this.Id}); //收参
@override
State<SearchApp> createState() => _SearchAppState();
} class _SearchAppState extends State<SearchApp> { @override
void initState() { //initState() 方法是 State 对象创建后的第一个方法,用于初始化数据和执行一次性的设置或操作。
super.initState();
print(widget.Id);
}
@override
Widget build(BuildContext context) { return Scaffold(
appBar: AppBar(
title: const Text("跳转后的页面导航栏"),
), body: Center(
child: Text("收到的参数:${widget.title}"),
),
);
}}

25、Flutter中基本路由的更多相关文章

  1. Flutter中管理路由栈的方法和应用

    原文地址:https://www.jianshu.com/p/5df089d360e4 本文首先讲的Flutter中的路由,然后主要讲下Flutter中栈管理的几种方法. 了解下Route和Navig ...

  2. Flutter 中的路由

    Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航. 并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.po ...

  3. Flutter中的路由 路由替换 返回到根路由

    一.Flutter 中返回到上一级页面 Navigator.of(context).pop(); 二.Flutter 中替换路由 比如我们从用户中心页面跳转到了 registerFirst 页面,然后 ...

  4. flutter中的路由跳转

    在前面的基本路由和命名路由中,都演示了如何进行路由跳转,并且在路由跳转以后,可以借用系统自带的按钮就行返回上一级,当然了,也可以自定义按钮返回上一级. 返回上一级 在前面的例子中,当从Home.dar ...

  5. 25.Flutter中的表单 Radio RadioListTile Switch SwitchListTile 以及表单组件实现一个简单的学员登记系统(下)

    四.Radio.RadioListTile单选按钮组件 Radio常用属性: value单选的值. onChanged改变时触发. activeColor:选中的颜色.背景颜色 groupValue: ...

  6. Flutter中的普通路由与命名路由(Navigator组件)

    Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航.并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.pop ...

  7. Flutter 中的基本路由

    Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航,并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.pop ...

  8. Flutter 中的普通路由、普通路由传值、 命名路由、命名路由传值

    一.Flutter 中的路由 Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航.并提供了管理堆栈的方法.如:Navigator.push ...

  9. 16Flutter中的路由 基本路由 基本路由跳转传值(上)

    /* Flutter中的普通路由.普通路由传值.命名路由.命名路由传值 Flutter中的路由通俗的讲就是页面跳转.在Flutter中通过Navigator组件管理路由导航. 并提供了管理堆栈的方法. ...

  10. flutter中的命名路由

    命名路由是区别于基本路由的一种存在,方便于大型项目中路由的统一管理,现在,在前面基本路由的项目基础上实现实现命名路由. 使用步骤 路由配置 命名路由在使用前,需要在根组件main.dart中进行简单的 ...

随机推荐

  1. 在Docker下一键安装部署免费开源的问答社区!

    在Docker下一键安装部署免费开源的问答社区!   1.准备一台VPS主机,没有的话,[搞一台] 2.一键安装部署Docker wget https://raw.githubusercontent. ...

  2. Dash 2.14版本开始支持动态回调注册!

    本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/dash-master 大家好我是费老师,就在昨晚,Dash框架发布了其2.14.0新版本,新增的功能 ...

  3. 关于Windows打印机驱动相关问题-如何利用Java(或其他)调用打印机驱动程序完成原始文件翻译为PCL语言的步骤

    前面这些都是问题描述,问题在偏下面 场景:用户电脑上安装了PCL驱动,可通过驱动完成打印. 需求:现在需要提供一种脱离PC端完成文件上传并打印的功能.让用户使用手机或pc未安装驱动时都能打印文件. 目 ...

  4. JVM-JVM是如何执行方法调用的

    重载.重写 void invoke(Object obj, Object... args) { ... } void invoke(String s, Object obj, Object... ar ...

  5. 生成伪随机数 rand;srand函数

    1 相关内容来自鱼c论坛https://fishc.com.cn/forum.php?mod=viewthread&tid=84363&extra=page%3D1%26filter% ...

  6. OpenAI宫斗反转反转再反转,到底是资本任性还是人性扭曲?

    最近OpenAI发生了一件大事,创始人山姆·奥特曼被董事会开除了,这在AI界引起了轩然大波. 事件经过 我们先来捋一下事件经过,时间以美国旧金山当地时间为准. 11月17日 11月17日12点(北京时 ...

  7. 【Java】Java中StringBuilder()成员方法append()和toString()

    StringBuilder就相当于C++的String长度可变,用于构造字符串对象,内部使用自动扩容的数组操作字符串数据. StringBuilder和StringBuffer使用的是相同的API[区 ...

  8. 【驱动】串口驱动分析(二)-tty core

    前言 tty这个名称源于电传打字节的简称,在linux表示各种终端,终端通常都跟硬件相对应.比如对应于输入设备键盘鼠标,输出设备显示器的控制终端和串口终端.也有对应于不存在设备的pty驱动.在如此众多 ...

  9. 2023你需要使用的最佳VSCode扩展插件

    选择最佳的 Visual Studio Code(以下简称 VSCode) 扩展插件对于提高开发效率和改善编程体验非常重要. 下面将详细介绍一些广受欢迎且功能丰富的 VSCode 扩展插件,包括编辑器 ...

  10. jmeter编写java脚本

    jmeter开发java脚本主要的依赖包有三个如下图 步骤1 :打开idea,创建一个project,导入上图依赖包 步骤2:创建一个类,继承AbstractJavaSamplerClient类,并实 ...