• 002 flutter的路由管理--命名路由


    一 .概述

    在前面我们说明了普通路由和对应的参数传递,但是在实际的项目之中,我们一般更多的会去使用命名路由.

    命名路由可以让我们统一的进行路由的管理.

    本次我们就来说明一下对应的命名路由是怎么实现的.

    二 .定义全局的touters

    Map<String,WidgetBuilder> routes = {
      "/home" : (context) => HomePage(),
    };
    

     在上面的代码之中,我们实际上定义了一个字符串和路由的映射关系.

    上面的代码我们需要注册到flutter的统一管理之中.

    void main() => runApp(
          MaterialApp(
            home: Scaffold(
              appBar: AppBar(
                title: Text("title"),
              ),
              body: MyApp(),
            ),
            routes: routes,
          ),
        );
    

      现在我们只需要使用下面的代码就可以完成命名路由了.

    RaisedButton(
                  child: Text("使用命名路由"),
                  onPressed: (){
                    Navigator.pushNamed(context, "/home");
                  },
                ),
    

      我们可以发现,我们使用命名路由会简单很多,这少不需要再每次使用路由的时候都写那么长的代码了,还可以进行统一的管理.

    三 . 使用命名路由进行参数的传递

    在早期的flutter之中,是不支持命名路由传值的,但是当前的最新版本是支持的.

    我们现在的全局路由变成了这样:

    Map<String, WidgetBuilder> routes = {
      "/home": (context) => HomePage(),
      "/search" : (context,{arguments}) => SearchPage(arguments: arguments,),
    };
    

      下面是使用命名路由的方式.

    RaisedButton(
                  child: Text('命名路由传值'),
                  onPressed: (){
                    Navigator.pushNamed(context, '/search',arguments: {
                      "id" : 12344
                    });
                  },
                )
    

      总结 : 

    使用命名路由虽然现在变成了可行的操作,但是依然比较别扭.

    还好,这些都是定死的东西,我们后面只需要按照这种方式i就可以完成命名路由传递数据了.

  • 相关阅读:
    var、let、const之间的区别
    es5和es6的区别
    [2020CCPC威海G] Caesar Cipher
    [CF1437E] Make It Increasing
    [CF1437C] Chef Monocarp
    [CF1436D] Bandit in a City
    [CF1418D] Trash Problem
    [CF1419E] Decryption
    [CF1420C2] Pokémon Army (hard version)
    [CF1424M] Ancient Language
  • 原文地址:https://www.cnblogs.com/trekxu/p/12238710.html
Copyright © 2020-2023  润新知