路由:

正常跳转: 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. git管理分支某公司的流程

  2. 版本问题---Bazel与tensorflow的对应关系

    源码安装tf的时候,会用到Bazel,版本不对应,后面会引起好多麻烦. echo "deb [arch=amd64] http://storage.googleapis.com/bazel- ...

  3. 【转】如何在TensorFlow中高效使用数据集

    本文主要记录tensorflow一个比较好用的API:Dataset,feed-dict 是向 TensorFlow 传递信息最慢的方式,应该尽量避免使用.向模型提供数据的正确方式是使用输入管道,这样 ...

  4. unittest单元测试笔记

    单元测试 unittest单元测试是基于java的JUnit思想框架开发出来的测试框架 import unittest import HTMLTestRunner class Mytest1(unit ...

  5. Geohash 基本知识及 .NET 下计算相邻8个区域编码

    目录 一.简介 二.计算方法 三.GeoHash的精度 四.查找相邻8个区域的Geohash编码(.NET) 五.MySQL 中使用 GeoHash 最近项目中需要搜索周边的 POI 信息,查找的过程 ...

  6. 从groupby 理解mapper-reducer

    注,reduce之前已经shuff. mapper.py #!/usr/bin/env python """mapper.py""" imp ...

  7. vscode安装依赖报错 TypeError: zipfile.readEntry is not a function

    错误原因是npm的版本太高,需要把5.x的版本换回4.x的 npm install npm@4 -g 或者 cnpm install npm@4 -g 详见:https://github.com/Mi ...

  8. 073_使用 shell 脚本打印如下图形

    #!/bin/bash #打印第一组图片#for(())为类 C 语言的语法格式,也可以使用 for i in;do;done 的格式替换#for((i=1;i<=9;i++))循环会执行 9 ...

  9. 三十三.mysqldump 实时增量备份 、innobackupex

    1.数据库备份与恢复 逻辑备份工具 mysqldump 使用mysql 恢复数据库   1.1备份MySQL服务器上的所有库 ]# mysqldump -u root -p123456 --all-d ...

  10. CF455C Civilization

    嘟嘟嘟 水题一道,某谷又恶意评分. 合并无非是将两棵树的直径的中点连一块,记原来两棵树的直径为\(d_1, d_2\),那么新的树的直径就是\(max(d_1, d_2, \lceil \frac{d ...