美文网首页
Flutter 页面跳转并返回数据

Flutter 页面跳转并返回数据

作者: 前端新阳 | 来源:发表于2020-05-26 01:06 被阅读0次

    【重点】:异步请求与返回数据

    • main.dart代码:
    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: (){
            _navigateToXiaoJieJie(context);
          },
          child: Text('去找小姐姐'),
        );
      }
    
      // 加 _ 表示内部的方法
      _navigateToXiaoJieJie(BuildContext context) async{
        final result = await Navigator.push(context, MaterialPageRoute(
            builder: (context)=>XiaoJieJie()
        ));
        
        Scaffold.of(context).showSnackBar(SnackBar(content: Text('$result'),));
      }
    }
    
    class XiaoJieJie extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('我是小姐姐'),
          ),
          body: Center(
            child: Column(
              children: <Widget>[
                RaisedButton(
                  child: Text('大长腿小姐姐'),
                  onPressed: (){
                    Navigator.pop(context, '大长腿小姐姐:13522202020');
                  },
                ),
                RaisedButton(
                  child: Text('小蛮腰小姐姐'),
                  onPressed: (){
                    Navigator.pop(context, '小蛮腰小姐姐:13588889999');
                  },
                ),
              ],
            ),
          ),
        );
      }
    }
    
    

    【效果】如下:


    首页
    选中其中一个选项
    接收到数据的首页,弹框2秒钟消失

    相关文章

      网友评论

          本文标题:Flutter 页面跳转并返回数据

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