Flutter学习第4章 子页面向父页面传值

346 阅读1分钟

1、代码

import 'package:flutter/material.dart';

void main() {
    runApp(MaterialApp(
      title: '子页面向父页面传值',
      home: FirstPage(),
    ));
}

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title:Text('向子类要值')),
        body: RouteButton(),
    );
  }
}

class RouteButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
        onPressed:(){
              _navigateToSonPage(context);
            
        },
        child:Text('索值')
    );
  }
}
//异步方法
_navigateToSonPage(BuildContext context) async{
  final result = await Navigator.push(
    context, 
    MaterialPageRoute(builder: (context) => SonPage())
  );

  Scaffold.of(context).showSnackBar(SnackBar(content:Text('$result')));//底部的一个bar提示
}

class SonPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('这里是子页面'),
      ),
      body:Center(
        child: Column(
          children:<Widget>[
            RaisedButton(
              child: Text('第一个button'),
              onPressed: (){
                Navigator.pop(context,'第一个参数的值是1');
              },
            ),
             RaisedButton(
              child: Text('第二个button'),
              onPressed: (){
                Navigator.pop(context,'第二个参数的值是2');
              },
            )
          ]
        ),
      )
    );
  }
}

1、异步请求和等待

Dart中的异步请求和等待和ES6中的方法很像,直接使用async...await就可以实现。比如下面作了一个找小姐姐的方法,然后进行跳转,注意这时候是异步的。等待结果回来之后,我们再显示出来内容。具体代码如下:

_navigateToSonPage(BuildContext context) async{
  final result = await Navigator.push(
    context, 
    MaterialPageRoute(builder: (context) => SonPage())
  );
}

2、SnackBar的使用

SnackBar是用户操作后,显示提示信息的一个控件,类似Tost,会自动隐藏。SnackBar是以Scaffold的showSnackBar方法来进行显示的。

 Scaffold.of(context).showSnackBar(SnackBar(content:Text('$result')));//底部的一个bar提示

3、返回数据的方式

返回数据其实是特别容易的,只要在返回时带第二个参数就可以了。

RaisedButton(
              child: Text('第一个button'),
              onPressed: (){
              //返回数据的方式
                Navigator.pop(context,'第一个参数的值是1');
              },
            ),

4、效果预览