flutter-页面跳转并返回数据

页面跳转后，当我们返回页面时返回结果到上一个页面（也就是父页面）。比如，我们去子页面选择了一项选项，然后把选择的结果返回给父级页面。

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

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: Center(
        child: RouteButton()
      ),
    );
  }
}

class RouteButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        _navigatorToTargetPage(context);
      },
      child: Text('跳转到目标页面'),
    );
  }

  _navigatorToTargetPage(BuildContext context) async {
    final result = await Navigator.push(
        context, MaterialPageRoute(builder: (context) => TargetPage()));

    Scaffold.of(context).showSnackBar(SnackBar(content: Text('$result')));
  }
}

class TargetPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('我是目标页面'),
      ),
      body: Center(
        child: Column(
          children: [
            RaisedButton(
              child: Text('参数1'),
              onPressed: () {
                Navigator.pop(context, '返回的参数1');
              }
            ),
            RaisedButton(
              child: Text('参数2'),
              onPressed: () {
                Navigator.pop(context, '返回的参数2');
              }
            ),
          ],
        ),
      ),
    );
  }
}