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

最新推荐文章于 2025-03-10 20:47:16 发布
原创 最新推荐文章于 2025-03-10 20:47:16 发布 · 290 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#flutter #android
文章详细介绍了Flutter中的路由管理，包括普通路由、基本路由的使用和传值，命名路由的配置与跳转传值，以及如何将命名路由抽离到单独文件。此外，还讨论了返回上一级页面、替换路由和回到根路由的操作。

文章目录

一、 Flutter 中的普通路由

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

二、 Flutter 中的基本路由使用

比如我们现在想从 HomePage 组件跳转到 SearchPage 组件。
1、需要在 HomPage 中引入 SearchPage.dart

在这里插入图片描述2、在 HomePage 中通过下面方法跳转

在这里插入图片描述

三、 Flutter 中的基本路由跳转传值

比如我们现在想从 HomePage 组件跳转到 SearchPage 组件传值。
1、需要在 HomPage 中引入 SearchPage.dart
在这里插入图片描述2、在 HomePage 中通过下面方法跳转
在这里插入图片描述

四、 Flutter 中的命名路由

1、配置路由

在这里插入图片描述2、路由跳转
在这里插入图片描述
在这里插入图片描述

五、 Flutter 中的命名路由跳转传值

官方文档：https://flutter.dev/docs/cookbook/navigation/navigate-with-arguments

1、配置路由：
在这里插入图片描述
在这里插入图片描述

2、跳转传值
在这里插入图片描述

3、接收参数
在这里插入图片描述

六、Flutter 中的命名路单独抽离到一个文件

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

七、Flutter 中返回到上一级页面在这里插入图片描述

八、Flutter 中替换路由

比如我们从用户中心页面跳转到了 registerFirst 页面，然后从 registerFirst 页面通过
pushReplacementNamed 跳转到了 registerSecond 页面。这个时候当我们点击 registerSecond
的返回按钮的时候它会直接返回到用户中心。
在这里插入图片描述

九、Flutter 返回到根路由

比如我们从用户中心跳转到 registerFirst 页面，然后从 registerFirst 页面跳转到 registerSecond
页面，然后从 registerSecond 跳转到了 registerThird 页面。这个时候我们想的是 registerThird
注册成功后返回到用户中心。 这个时候就用到了返回到根路由的方法。
在这里插入图片描述

Flutter路由与导航示例，包含页面跳转和传值传参，接收页面返回数据等功能
04-09
Flutter路由与导航示例，包含页面跳转和传值传参，接收页面返回数据等功能。详情请看博客：https://yuzhiqiang.blog.csdn.net/article/details/89090742
Flutter路由与导航示例，页面跳转和传值传参，接收页面返回数据
04-15
Flutter路由与导航示例，包含页面跳转和传值传参，接收页面返回数据等功能。详情请看博客：https://yuzhiqiang.blog.csdn.net/article/details/89090742
Flutter中路由传值方式
我叫柱子哥
10-11 2251
这篇文章主要介绍Flutter路由传值的方式。
12Flutter普通路由以及路由传值
LJLThomson的博客
04-06 404
Flutter 中的普通路由、普通路由传值、 命名路由、命名路由传值 Flutter 中的路由通俗的讲就是页面跳转。在 Flutter 中通过 Navigator 组件管理路由导航。 并提供了管理堆栈的方法。如：Navigator.push 和 Navigator.pop Flutter 中给我们提供了两种配置路由跳转的方式：1、基本路由 2、命名路由 1.基本路由 比如我们现在想从 HomePage 组件跳转到 SearchPage 组件 class _HomePageState extends Sta
Flutter页面路由导航及传参
piaomiao8179的博客
01-21 3039
转载请注明出处: https://learnandfish.com/ 概述 每个应用都有很多个页面，在flutter中同样也有很多页面，被称之为路由(Router)，页面之间的跳转通过导航器(Navigator)进行管理。 其中 Navigator.push 和 Navigator.pop 是最简单的跳转到新页面和返回到上一级界面的方式。 路由分为静态路由(即命名路由)和动态路由。页面之间跳...
Flutter路由及传参
我的博客
12-01 5761
前言 一个APP往往是由很多个页面组成的，单独的一个页面在安卓里面称为Activity，IOS称为ViewController，在Flutter里面仅仅是一个Widget。本文讲解Flutter的路由，Flutter内的路由组件有Navigator 和Router 。简单的可以用Navigator，更复杂的可以用Router。主要学习两个页面之间的跳转和传参，以及跨屏动画。 简单路由 在Flutter中，Navigator维护了一个堆栈，用来管理页面路由。可以通过Navigator.push()和Navig
Flutter 基础（五）Route 路由以及页面间传值
AboBack
09-14 3445
Route 路由以及页面间传值 一种页面跳转机制 路由 Route 对应到 Android 就是 Intent Flutter 路由分两种：新建路由、注册路由 需要Route表示 Navigator进行管理 跳转页面 Navigator.push() 返回页面 Navigator.pop() 传值 1.新建路由 import 'package:flutter/material.dart'; ...
Flutter中的普通路由&普通路由传值和命名路由&命名路由传值、返回根目录
一花一世界 一叶一菩提
02-18 604
在Flutter中 我们通过Navigator组件来管理路由导航 Navigator.push和Navigator.pop Flutter给我们提供了两种配置路由的跳转方式：基本路由、命名路由。 一、普通路由 以上篇文字的Home组件为例， 在onPressed监听事件中设置跳转的方法。 Home.dart import 'package:flutter/material.dart...
Flutter页面之间的跳转，普通路由、普通路由传值、 命名路由、命名路由传值
u012941592的博客
06-07 476
1.路由介绍 Flutter中的页面跳转也就是路由，Flutter中通过Navigator组件来管理路由导航，提供了堆栈管理。 Flutter中给我们提供了两种配置路由跳转的方式：基本路由和命名路由 2.基本路由得使用 1）基本路由的使用 Navigator.of(context).push( MaterialPageRoute( builder: (context) { ..
【Flutter】路由详解
一以贯之的努力 不得懈怠的人生
05-27 2052
介绍了Flutter中路由的使用。
Flutter—路由
大模型训练
02-15 2646
路由（Route）在移动开发中通常指页面（Page），这跟 Web 开发中单页应用的 Route 概念意义是相同的，Route 在 Android中 通常指一个 Activity，在 iOS 中指一个 ViewController。所谓路由管理，就是管理页面之间如何跳转，通常也可被称为导航管理。Flutter 中的路由管理和原生开发类似，无论是 Android 还是 iOS，导航管理都会维护一个路由栈，路由入栈（push）操作对应打开一个新页面，路由出栈（pop）操作对应页面关闭操作，而路由管理主要是指如何
flutter如何引用传值_Flutter 路由跳转及传值详解(Navigator的使用)
weixin_42186015的博客
02-06 1865
在 Flutter 中想要实现页面间的跳转和传值的话，离不开两种路由：基本路由命名式路由官方说的是静态路由和动态路由，不过我习惯了这样叫，所以就暂且这样说吧！基本路由基本跳转基本路由的跳转使用push跳到指定的页面，然后再使用pop回到原来的页面不过当你跳转过去的时候，人家默认会有一个返回的箭头按钮，点击就可以返回开始撸代码我在main.dart文件中引用了Home.dart文件在Home.dar...
Flutter路由的跳转、动画和传参详解（最简单）
01-05
路由 做Android/iOS原生开发的时候，要打开一个新的页面，你得知道你的目标页面对象，然后初始化一个Intent或者ViewController，再通过startActivity或者pushViewController来推出一个新的页面，不能跟web一样，直接丢一个链接地址就跳转到新的页面。当然，可以自己去加一个中间层来实现这些功能。 Flutter里面是原生支持路由的。Flutter的framework提供了路由跳转的实现。我们可以直接使用这些功能。 Flutter路由介绍 Flutter里面有路由支持所有的路由场景，push、pop页面，页面间的参数传递等等。flutter里
Flutter之命名路由页面传值
Kirin的博客
09-05 628
Flutter之命名路由页面传值
Flutter 中的路由：普通路由与普通路由传值（上）
最新发布
m0_57836225的博客
03-10 622
普通路由是 Flutter 中最基础的页面导航方式，通过它，我们可以轻松地从一个页面跳转到另一个页面。在 Flutter 里，路由的管理主要借助Navigator类来实现，Navigator就像是一个栈，每打开一个新页面，就把这个页面压入栈中，当用户点击返回按钮时，栈顶的页面就会被弹出，回到上一个页面。
【Flutter——路由导航】
muzillll的博客
06-25 2989
Flutter路由导航
Flutter 路由界面传值
2401_85122049的博客
06-04 415
/ title: “跳转到表单界面并传值”,
Flutter 开发技巧：静态路由传值与页面布局优化
m0_57836225的博客
03-05 611
在 Flutter 开发过程中，掌握静态路由传值以及灵活运用各种组件进行页面布局优化是提升应用用户体验的关键技能。今天，咱们就结合实际代码，深入探讨一下这两个重要知识点。
Flutter路由管理和页面参数的传递（获取&返回）
热门推荐
stven_king的专栏
07-20 1万+
前言 在做 Flutter 开发的时候所有的页面以及页面上的元素都变成了 Widget ，创建一个页面或者视图直接 new 一个新的 widget 就可以，相关的参数我们可以直接通过构造函数直接传递。 我们做 Android 开发的人员都知道 Android 应用程序在进行页面跳转的时候可以利用Intent进行参数传递，那么再开发 Flutter 的时候有类似的方式可以进行参数传递么？答案当然是有...
Flutter 中的普通路由、普通路由传值
蓝枫
02-06 524
Flutter中通过Navigator组件管理路由导航，并提供了管理堆栈方法 Navigator.push Navigator.pop main.dart //导入了Material UI组件库 ,快捷操作fim import 'package:flutter/material.dart'; import 'pages/Tabs.dart'; void main() { r...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值