美文网首页
11. 页面跳转返回,并回传值

11. 页面跳转返回,并回传值

作者: 努力生活的西鱼 | 来源:发表于2021-11-16 15:28 被阅读0次
1. 跳转返回后,接收子页面传来的值

这次我们在父级页面,点击按钮,进入子页面,点击子页面的不同按钮,返回父页面的时候,弹出从子页面返回的信息

2. 父级页面
void main() {
  runApp(MaterialApp(
    title: "跳转页面并返回值",
    home: Scaffold(
      appBar: AppBar(
        title: const Text("去找小姐姐"),
      ),
      body: Center(
          child: Button()
      ),
    ),
  ));
}

class Button extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      child: const Text("去找小姐姐"),
      onPressed: () {
        navigateToXiaoJieJie(context);
      },
    );
  }

}

navigateToXiaoJieJie(BuildContext context) async {

  final result = await Navigator.push(context, MaterialPageRoute(builder: (context) => XiaoJieJie()));

  ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text("$result")));
}
3. 子页面
class XiaoJieJie extends StatelessWidget {

  const XiaoJieJie({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text("人物列表"),
        ),
        body: Center(
          child: Column(
            children: [
              ElevatedButton(
                  child: const Text("王语嫣"),
                  onPressed: () {
                    Navigator.pop(context, "王语嫣:18549806226");
                  }),
              ElevatedButton(
                  child: const Text("王菲"),
                  onPressed: () {
                    Navigator.pop(context, "王菲:18549806228");
                  }),
            ],
          ),
        ));
  }
}

相关文章

  • 11. 页面跳转返回,并回传值

    1. 跳转返回后,接收子页面传来的值 这次我们在父级页面,点击按钮,进入子页面,点击子页面的不同按钮,返回父页面的...

  • ionic关于跳转那些事

    简单介绍一下跳转页面,和页面传值 引入 页面跳转并传值 返回上一页 请求接口失败或者成功返回页面 如果需要返回是传入值

  • swift 闭包传值

    场景:A页面跳转到B页面,B页面返回到A页面,(B页面给A页面传值) B页面逻辑:创建block,声明变量,传值 ...

  • swift 代理传值

    场景:A页面跳转到B页面,B页面返回到A页面,(B页面给A页面传值) B页面逻辑:创建协议,声明变量,传值 A页面...

  • 路由跳转(非命名路由)

    单纯跳转: 路由传值跳转: 路由传值返回跳转:

  • swift 通知传值

    场景:A页面跳转到B页面,B页面返回到A页面,(B页面给A页面传值) B页面逻辑:发送通知 A页面逻辑:创建通知,...

  • Flutter--Route和Navigator(三)

    主要实现功能,返回页面传值 Flutter页面返回传值,类似于activity的startActivityForR...

  • 微信小程序几种常用的跳转方式并传值

    第一种:通过链接传值(跳转页面传值) 第二种:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 第...

  • vue逆向传值

    vue返回上个页面逆向传值传多个值

  • Flutter页面/组件传值

    父子组件之间的传值 父组件 页面导航打开新页面和返回新页面 导航之间的传值 返回页面传值 创建一个TipRoute...

网友评论

      本文标题:11. 页面跳转返回,并回传值

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