路由:

正常跳转: Navigator.pushNamed(context,'/product');  
路由替换:

Navigator.pushReplacementNamed(context, '/productinfo',
     arguments: {"pid":778899}
);
返回上一页:

Navigator.of(context).pop();
 
//返回根路由:
Navigator.of(context).pushAndRemoveUntil(
    new MaterialPageRoute(builder: (context)=>new Tabs(index: 1)),
     (route)=>route==null
);
测试代码:
Home.dart
import 'package:flutter/material.dart';
class HomePage extends StatelessWidget {
const HomePage({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('跳转到搜索页面'),
onPressed: (){
Navigator.pushNamed(context,'/search',arguments: {
"id":
});
},
color: Theme.of(context).accentColor,
textTheme: ButtonTextTheme.primary
),
RaisedButton(
child: Text('跳转到商品页面'),
onPressed: (){
Navigator.pushNamed(context,'/product');
}
)
],
);
}
}

Product.dart

import 'package:flutter/material.dart';

class ProductPage extends StatefulWidget {
ProductPage({Key key}) : super(key: key); _ProductPageState createState() => _ProductPageState();
} class _ProductPageState extends State<ProductPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('商品页面'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('跳转到商品详情页面'),
onPressed: () {
// Navigator.pushReplacementNamed(context, '/productinfo',
// arguments: {"pid":778899}
// );
Navigator.pushNamed(context, '/productinfo',
arguments: {"pid":}
);
},
color: Theme.of(context).accentColor,
textTheme: ButtonTextTheme.primary),
],
)
);
}
}

ProductInfo.dart

import 'package:flutter/material.dart';
import '../pages/Tabs.dart'; class ProductInfoPage extends StatefulWidget {
Map arguments;
ProductInfoPage({Key key, this.arguments}) : super(key: key); _ProductInfoPageState createState() =>
_ProductInfoPageState(arguments: this.arguments);
} class _ProductInfoPageState extends State<ProductInfoPage> {
Map arguments;
_ProductInfoPageState({this.arguments});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('商品详情页面'),
),
// body: Text("这是一个商品详情页面pid=${arguments["pid"]}")
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('完成'),
onPressed: () {
// Navigator.of(context).pop(); //返回根:
Navigator.of(context).pushAndRemoveUntil(
new MaterialPageRoute(builder: (context)=>new Tabs(index: )),
(route)=>route==null
);
}
),
],
),
);
}
}

Tabs.dart

import 'package:flutter/material.dart';
import 'tabs/Home.dart';
import 'tabs/Category.dart';
import 'tabs/Setting.dart';
class Tabs extends StatefulWidget {
final index;
Tabs({Key key,this.index=}) : super(key: key);
_TabsState createState() => _TabsState(this.index);
} class _TabsState extends State<Tabs> {
int _currentIndex = ;
_TabsState(index){
this._currentIndex=index;
}
List _pageList=[
HomePage(),
CategoryPage(),
SettingPage()
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter Demo'),
),
bottomNavigationBar: BottomNavigationBar(
currentIndex: this._currentIndex,
onTap: (int index) {
// print(index);
setState(() {
this._currentIndex = index;
});
},
iconSize: 36.0,
type: BottomNavigationBarType.fixed,
fixedColor: Colors.red,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('首页')),
BottomNavigationBarItem(
icon: Icon(Icons.category), title: Text('分类')),
BottomNavigationBarItem(
icon: Icon(Icons.settings), title: Text('设置')),
]),
body: this._pageList[this._currentIndex],
);
}
}

main.dart

import 'package:flutter/material.dart';
import 'package:flutter_demo/pages/Search.dart';
import 'routes/Routes.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
initialRoute: '/',
onGenerateRoute: onGenerateRoute
);
}
}
 

18Flutter中的路由、路由替换、返回到根路由:的更多相关文章

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

    替换路由 当我们有三个页面,页面1,页面2,页面3. 期望点击页面1按钮,跳转到页面2,页面2点击返回,跳转到页面1: 点击页面2按钮,跳转到页面3,页面3点击返回,跳转到页面1,而不是页面2. 这时 ...

  2. vue中的组件,Component元素,自定义路由,异步数据获取

    组件是Vue最强大的功能之一.组件是一组可被复用的具有一定功能,独立的完整的代码片段,这个代码片段可以渲染一个完整视图结构组件开发如何注册组件?第一步,在页面HTML标签中使用这个组件名称,像使用DO ...

  3. ionic back 返回按钮不正常显示&&二级路由点击返回按钮失效无法返回到上一级页面的问题

    很多时候,app不只有一两级路由,还要三四级路由,但是在ionic中,给出的返回键三级或四级无法使用,所以得自定义方法设置返回. 直接贴代码: <ion-nav-buttons side=&qu ...

  4. 056——VUE中vue-router之路由参数的验证处理保存路由安全

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. Spring Cloud (十三) Zuul:静态路由、静态过滤器与动态路由的实现

    前言 本文起笔于2018-06-26周二,接了一个这周要完成的开发任务,需要先等其他人的接口,可能更新的会慢一些,还望大家见谅.这篇博客我们主要讲Spring Cloud Zuul.项目地址:我的gi ...

  6. 理解Web路由(浅谈前后端路由与前后端渲染)

    1.什么是路由? 在Web开发过程中,经常会遇到『路由』的概念.那么,到底什么是路由?简单来说,路由就是URL到函数的映射. 路由的概念最开始是由后端提出来的,在以前用模板引擎开发页面的时候,是使用路 ...

  7. vue动态添加路由addRoutes之不能将动态路由存入缓存

    在我不知道vue的路由还可以通过addRoutes动态添加时,我只知道vue的路由都是写死在路由表中的,每当跳转时再去加载相应的路由.直到在一个新公司接到需要根据用户的权限显示不同的菜单的需求时才知道 ...

  8. 2种方式解决vue路由跳转未匹配相应路由避免出现空白页面或者指定404页面

    https://www.cnblogs.com/goloving/p/9254084.html https://www.cnblogs.com/goloving/p/9254084.html 1.路由 ...

  9. Laravel之路由 Route::get/post/any、路由参数、过滤器、命名、子域名、前缀、与模型绑定、抛出 404 错误、控制器

    基本路由 应用中的大多数路都会定义在 app/routes.php 文件中.最简单的Laravel路由由URI和闭包回调函数组成. 基本 GET 路由 代码如下: Route::get('/', fu ...

随机推荐

  1. 某个Spring Cloud分布式架构

  2. logstash可以考虑在项目中用起来

    在用Node.js开发项目的时候,我们常用 log4js 模块来进行日志的记录,可以通过配置 log4js 的 Appenders 将日志输出到Console.File和GELF等不同的地方. log ...

  3. Java下的tinylog日志打印

    做个笔记. 做某个功能时需要DEBUG调试日志,但是直接System.out.println 是打印在终端,有些情况下是看不到输出的,所以需要用日志框架去打印输出值. 经过搜索完以后发现Logback ...

  4. selenium之python源码解读-expected_conditions

    一.expected_conditions 之前在 selenium之python源码解读-WebDriverWait 中说到,until方法中method参数,需要传入一个function对象,如果 ...

  5. 没有向ZK写offset数据

    两天公司要学习kafka,结合之前的storm,做了一个简单的集成,之前也参考了网上的例子一些例子,发现或多或少都有一些问题.所以自己做了一个. 这个是网上其他人遇到的问题,给摘录一下,防止以后自己和 ...

  6. 007_硬件基础电路_RC复位电路中二极管的作用

    --------------------- 作者:碎碎思 来源:CSDN 原文:https://blog.csdn.net/Pieces_thinking/article/details/781110 ...

  7. leetcode解题报告(20):Rotate Array

    描述 Rotate an array of n elements to the right by k steps. For example, with n = 7 and k = 3, the arr ...

  8. 基于JSON的接口测试框架

    更多学习资料请加QQ群: 822601020获取 实现效果 需求场景: 公司微服务接口使用数字签名的方式, 使用Postman调试接口每次都需要修改源码将验签临时关闭, 但是关闭后,其他微服务不能正常 ...

  9. Selenium 八种元素定位方法

    前言: 我们在做WEB自动化时,最根本的就是操作页面上的元素,首先我们要能找到这些元素,然后才能操作这些元素.工具或代码无法像我们测试人员一样用肉眼来分辨页面上的元素.那么我们怎么来定位他们呢? 在学 ...

  10. 如何设置xshell代理?

    场景:我想在公司内部用一台服务器A访问客户内网的机器C.在公司和客户之间有一台中间服务器B,我只能先连接到中间服务器,然后通过中间服务器跳转才能到客户C机器. 上面场景的连接策略:A->B-&g ...