Dart语言跳转页面和传参

Posted IparhanGeek

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Dart语言跳转页面和传参相关的知识,希望对你有一定的参考价值。

开始学习了Dart语言之后慢慢对这个语言产生了兴趣,然后也想好好的研究一下了,在这里简单讲述一下跳转页面和传参的方式。

先上代码吧:

import 'package:flutter/material.dart';

import 'package:meta/meta.dart';


/**

 * 跳转到新页面并返回

 */

void main() {

  runApp(new MaterialApp(

    title: "Flutter",

    home: new FirstScreen(),

  ));

}

/**

 * 第一个页面

 */

class FirstScreen extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return new Scaffold(

      appBar: new AppBar(

        title: new Text("Flutter"),

      ),

      body: new Center(

        child: new RaisedButton(

            child: new Text("登录"),

            onPressed: () {

              //跳转到新的 页面我们需要调用 navigator.push方法

              Navigator.push(context,

                  new MaterialPageRoute(builder: (context) => new Second()));

            }),

      ),

    );

  }

}


/**

 * 第二个页面

 */

class Second extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return new Scaffold(

      appBar: new AppBar(

        title: new Text("Flutter"),

      ),

      body: new Center(

        //onPressed  点击事件

        child: new RaisedButton(child: new Text("注销"), onPressed: () {

          //回到上一个页面 该pop将Route从导航器管理的路由栈中移除当前路径

          Navigator.pop(context);

        }),

      ),

    );

  }

}




2.1 push 方法单纯跳转页面
2.2 push 方法单纯跳转页面并传递参数


还有另一种方式:

1. pop 销毁当前页面

2. popAndPushNamed 销毁当前页面并跳转指向新的页面

then 返回值



 小菜刚接触 Flutter 时间不长,还有很多不清楚和不理解的地方,如果又不对的地方还希望多多指出。以下是小菜小程序,欢迎闲来吐槽~

具体和详细部分跳转到小程序里面看吧。

IparhanGeek Dart 页面跳转和传参


以上是关于Dart语言跳转页面和传参的主要内容,如果未能解决你的问题,请参考以下文章

Vue - 跳转和传参

react路由的跳转和传参

微信小程序页面跳转方法总结

微信小程序携参跳转页面

js控制页面带参跳转

Angular--get传值&动态路由(routerLink进行传参跳转)