美文网首页Flutter开发圈Flutter
『Flutter』路由正向逆向传值

『Flutter』路由正向逆向传值

作者: butterflyer | 来源:发表于2019-01-15 15:08 被阅读52次

flutter路由跳转,在看过ios的路由,vue的路由,其实对于路由已经有了一些了解。

这里需要学习的是flutter中路由正向传值逆向传值
首先需要先注册路由

void main(){
   runApp(flutterApp());
}

class flutterApp extends StatelessWidget{
  flutterApp({Key key}):super(key:key);
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new MaterialApp(
      title: 'fluttertest',
      home: flutterWidget(),
      routes: <String,WidgetBuilder>{
        // ignore: not_enough_required_arguments, not_enough_required_arguments
        '/routerOne':(BuildContext context) => new RouterOne('')
      },
    );
  }
}

push跳转

然后是跳转 静态跳转

Navigator.of(context).pushNamed('/routerOne');

动态跳转 正向传参

  Navigator.of(context).push(new MaterialPageRoute(builder: (context){
    return new RouterOne('xinhao test');
  }));

动态跳转 逆向传参

  Navigator.push(
        context,
        new MaterialPageRoute(
            builder: (BuildContext context) =>
                new RouterOne('xinhao test'))).then((data) {
              setState(() {
                _backData = data;
              });
    });
当执行pop的时候,pop中的参数就是then中的data
   Navigator.of(context).pop('xinhao');

pop跳转

Navigator.of(context).maybePop();

maybePop 会自动进行判断,如果当前页面pop后,会显示其他页面,不会出现问题,则将执行当前页面的pop操作 否则将不执行。

Navigator.of(context).canPop();

canPop 判断当前页面能否进行pop操作,并返回bool值

Navigator.of(context).pop()

直接退出到上级页面

因为这里需要做到传递参数,所以我们这里给routerone重新写了构造函数

import 'package:flutter/material.dart';

class RouterOne extends StatefulWidget {

  RouterOne(this.title);
  String title;
  @override
  _RouterOneState createState() => new _RouterOneState();
}

class _RouterOneState extends State<RouterOne> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        backgroundColor: Colors.red,
        title: new Text("demo1"),
      ),
      body: new Center(child: new Text(widget.title),),
    );
  }
}

这里需要注意,新建的dart文件要用脚手架把appbar布局出来,就跟ios一样,如果navbar没有,是不会有系统的navbar存在的。系统自带的返回按钮默认带pop事件。

https://github.com/Butteryflyyer/FlutterStudyDemo这是我学习flutter的代码地址,平时写的demo都会放到这里面。

相关文章

  • Flutter 正向逆向路由传值

    一 前言 记录一个小技巧,关于在路由push和pop的时候带上数据互相传递,而且不需要在注册的命名路由声明参数,使...

  • 『Flutter』路由正向逆向传值

    flutter路由跳转,在看过ios的路由,vue的路由,其实对于路由已经有了一些了解。 这里需要学习的是flut...

  • Flutter命名路由的使用和传值

    1.注册路由 2.路由传参和获取反向传的值 3.获取路由正向传的值

  • Vue页面间传值

    Vue传值的方式有正向传值和反向传值 正向传值:上一页面 --> 下一页面 路由传值 本地储存 eventbus ...

  • iOS页面间传值详解(二)

    在iOS页面间传值详解(一)中,介绍了iOS界面间的正向传值以及逆向传值的两种方法,其实逆向传值还可以使用bloc...

  • iOS 如何优雅地跨层通信

    1. 传值 (数据传递) 传值在程序开发中使我们每天需要面临的问题传值方式: 正向传值,逆向传值,跨层传值...一...

  • iOS页面间逆传值

    页面间传值有两种: 正向传值(利用属性传值就可以了,很简单) 逆向传值(有3种常用的方法) 代理传值 block传...

  • Flutter之路由详解

    本文主要包含两个方面:【路由导航】和【路由传值】 路由传值 Flutter中管理多个页面时有两个核心概念和类:Ro...

  • iOS代理、block、通知传值

    一般正向传值基本使用属性传值,这里不多讲。如果需要逆向传值,基本使用代理和block,也可以使用通知。这些基本都会...

  • iOS 正向、逆向传值总结

    iOS 开发中经常需要在页面间传递数据,也就是 值传递。常见的有的是 正向传递 也有 逆向传递。那么如何进行值传递...

网友评论

    本文标题:『Flutter』路由正向逆向传值

    本文链接:https://www.haomeiwen.com/subject/kuwedqtx.html