Flutter学习-GetX-01 路由管理

网上也有很多相关文章，这里记录下自己Getx的学习记录，使用。

本文主要介绍Getx以及GetX路由管理

Getx目前是比较火的一个框架，GetX 是 Flutter 上的一个轻量且强大的解决方案：高性能的状态管理、智能的依赖注入和便捷的路由管理。同时也有一些比较实用的工具。

对于详细的情形可以参考中文的Readme

1. GetView & GetxController

这里简单的说下GetView和GetxController， GetView 就是相比我们StatelessWidget多了一个controller

这样我们在页面获取GetxController的时候就不用手动获取

final controller = Get.put(NetworkController());

GetxController 通常会把我们的数据和方法放在这个类中，其中当我们的页面中包裹了GetBuilder的widget的时候就会更新页面，通常2种方式，一种主动调用update，或者使用obx（）包裹的组件进行响应式。

通过 Obx(() => ）包裹的类使用了listData，他的value改变则会更新页面

2. 路由管理

我们在项目中初始化的时候使用使用GetMaterialApp替换原生的MaterialApp

GetMaterialApp作为Widget树的入口，里面有很多功能，这里我们简单的说下关于路径方面的

Widget build(BuildContext context) {
  return refreshScaffold(child:  GetMaterialApp(
    title: 'Flutter Template Project',
    initialRoute: AppRoutes.scaffold, /// app 入口
    enableLog: const bool.fromEnvironment('dart.vm.product'),
    unknownRoute: unknownRoute,
    getPages: appRoutes,
    builder: EasyLoading.init(),
    theme: ThemeConfig.themeData,
  ));
}

• initialRoute:为我们初始化的路径，我们打开app后路径
• unknownRoute ：未知路径，跳转的页面
• getPages：我们所有的页面初始化放入的数组

下面看下路由的初始化：

• routeName

我们通过抽象类主要定义路径名称，通常是通过/来进行路径定义，这样也能清楚页面所在的位置

• GetPage 对于GetPage初始化通常有2种方式

1. 第一种比较简单就是通过GetPage进行包裹

GetPage(name: AppRoutes.web, page: () =>const WebViewPage()),

name为我们的路径的名称，后面就可以通过Get.toNamed(）进行跳转了。 page：就是我们初始化的的页面在进行跳转的时候进行初始化

1. 第二种是绑定业务逻辑binding

GetPage(
    name: AppRoutes.home,
    page: () =>  const HomePage(),
    binding: BindingsBuilder(() => Get.lazyPut(() => HomeController()))),

通过懒加载把我们的GetxController绑定到page页面上，这样我们就不用手动的获取。

通常我们的数组很多的话不好区分，我们可以根据功能进行区分

这里我们通过dart语法...进行解包，Cascades (.., ?..) 允许你对同一个对象进行一系列操作。这通常节省了创建临时变量的步骤，并允许您编写更多流畅的代码。

子页面就是类似的效果

父页面

子页面

3. 小结

关于Getx的路径管理目前就是这样做的，通过定义route的文件夹，里面创建一个存放路径名称的类，一个GetPage的的数组，通过GetMaterialApp进行初始化，指定入口等进行路由的创建。