Flutter学习-GetX-04 依赖注入

本文主要介绍下GetX中几种依赖注入的方式,可以通过初始化也可以通过懒加载

1. GetxController

• 第一种

对于GetxController这个类通常会类似我们 iOS中的mvvmm模式中的viewModel，进行处理逻辑。我们也可以存放数据之后通过响应式进行包裹数据的widget更新

• 第二种

或者说我们把这个数据拆分下，使用一些插件进行创建比如GetX插件一键初始化

会分成4个文件，其中我们的方法和逻辑放在logic文件，继承GetxController

class DetailLogic extends GetxController {
  final DetailState state = DetailState();

  @override
  void onReady() {
    // TODO: implement onReady
    super.onReady();
  }

  @override
  void onClose() {
    // TODO: implement onClose
    super.onClose();
  }

  add(){
    state.count.value++;
  }
}

state则是存放我们的数据

class DetailState {
  var count = 0.obs;

  DetailState() {
    ///Initialize variables
  }
}

page 展示我们的页面

class DetailPage extends StatefulWidget {
  @override
  _DetailPageState createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {
  final logic = Get.find<DetailLogic>();
  final state = Get.find<DetailLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("GetX"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() => Text('value -> ${state.count.value}')) ,
            ElevatedButton(
              onPressed: ()=> logic.add(),
              child: const Text('add'),
            ),
          ],
        ),
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<DetailLogic>();
    super.dispose();
  }
}

Bindings，通过懒加载的方式初始化Logic，也就是GetxController

class DetailsBinding extends Bindings {
  @override
  void dependencies() {
    Get.lazyPut(() => DetailsLogic());
  }
}

这2种方式来说，各有利弊，比如我们自己一些简单的页面或者逻辑，参数不是很多，就可以自己创建因为本身逻辑就比较清楚。第二种使用插件的方式相当于把逻辑和数据拆分了，对于参数数据比较多，可以进行拆分这样会清晰点，避免过于臃肿。

2. GetPut

• Get.put

因为我们使用Gex进行路由管理的时候，在同一个堆栈中我们可以通过page和control联系

比如我们页面中初始化通过Get.put进行初始化我们的controller

final controller = Get.put<GetXHomeController>(GetXHomeController());

我们在push下个页面中也可以获取

• Get.find

class NextPage extends StatelessWidget {
   NextPage({Key? key}) : super(key: key);

  final controller = Get.find<GetXHomeController>();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("nextPage"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() => Text('value -> ${controller.count}')) ,
            ElevatedButton(
              onPressed: ()=> controller.add(),
              child: const Text('add'),
            ),
          ],
        ),
      ),
    );
  }
}

我们controller中的count获取到，同时点击也对上个页面刷新，相当于2个页面共用一个controller

3. 懒加载

通常的话我们会在初始化的时候添加绑定关系

GetPage(name: AppRoutes.getXHome, page: () =>   GetxHomePage(),binding: BindingsBuilder(() => Get.lazyPut(() => GetXHomeController()))),

你也可以创建一个类

class DetailBinding extends Bindings {
  @override
  void dependencies() {
    Get.lazyPut(() => DetailLogic());
  }
}

加载的时候

Get.to(DetailPage(),binding: DetailBinding()),

这样的话多了一个类，方便的话可以直接按上面的方式

• 获取 获取的方式也是通过find或者我们继承GetView这样少写一步获取

class NextPage extends GetView<GetXHomeController> {
   const NextPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("nextPage"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() => Text('value -> ${controller.count}')) ,
            ElevatedButton(
              onPressed: ()=> controller.add(),
              child: const Text('add'),
            ),
          ],
        ),
      ),
    );
  }
}

GetView相当于帮我们获取了

abstract class GetView<T> extends StatelessWidget {
  const GetView({Key? key}) : super(key: key);

  final String? tag = null;

  T get controller => GetInstance().find<T>(tag: tag)!;

  @override
  Widget build(BuildContext context);
}

4. 小结

依赖注入通常我们通常可以采用懒加载的方式binding我们的GetXContrller，当然我们也可以在页面初始化的时候通过Get.put进行初始化。对于继承GetView的Widget则不需要我们手动通过Get.find获取。