Uso do Flutter GetX

Endereço para download:
https://pub-web.flutter-io.cn/packages/get

Dependências de importação:

dependencies:
  get: ^4.6.5

Importe o arquivo de cabeçalho:

import 'package:get/get.dart';

usar Obx(),GetX<T>()

Crie dados globais Countere herde GetxController:

class Counter extends GetxController {
    
    
  /// 在使用GetX时,我们必须通过在值的末尾添加以下内容使变量可被观察到 **obs**在值的末尾加上然后,
  /// 当变量发生变化时,应用程序中依赖它的其他部分将得到通知。
  var count = 0.obs; // 等同于 RxInt count = 0.obs;

  increment() => count.value++;
}

Adicione dependências:

  /// 注入依赖
  Counter controller = Get.put(Counter());

Adicione componentes Obx()para monitorar os dados de exibição:

/// 监听数据: Obx 返回一个组件
Obx(
	() => Text('您点击了${
      
      controller.count}次'),
),

/// GetX<T>() 等同于 Obx()
GetX<Counter>(
	builder: (_) {
    
    
	return Text('您点击了${
      
      _.count}次');
	},
),

Alterar dados:

/// 改变数据
controller.increment();

usarGetBuilder<T>()

Crie MyControllerherança de dados global GetxController:

class MyController extends GetxController {
    
    
  var number = 0;

  add() {
    
    
    number++;
    update();// 监听数据更新
  }
}

Adicione dependências:

  MyController controller = Get.put(MyController());

Adicione componentes GetBuilder<T>:

              GetBuilder<MyController>(
                  init: controller,
                  initState: (_) {
    
    },
                  dispose: (state) {
    
    },
                  builder: (_) {
    
    
                    return Column(
                      children: [
                        Text('您点击了${
      
      _.number}次'),
                        ElevatedButton(
                          child: const Text("Click"),
                          /// 改变数据
                          onPressed: () => _.add(),
                        ),
                      ],
                    );
                  },
                ),

usarValueBuilder<T?>

                /// ValueBuilder 监听数据
                ValueBuilder<int?>(
                  initialValue: 0,
                  onDispose: () {
    
    },
                  onUpdate: (p0) => print("$p0"),
                  builder: (value, updater) {
    
    
                    return Column(
                      children: [
                        Text('您点击了$value次'),
                        ElevatedButton(
                          child: const Text("Click"),
                          onPressed: () {
    
    
                            value = (value ?? 0) + 1;
                            updater(value);//更新数据
                          },
                        ),
                      ],
                    );
                  },
                ),

As dependências adicionadas são globais, considerando a questão da liberação de memória, depositelas precisam ser liberadas no momento da criação da página.controller

  
  void dispose() {
    
    
    super.dispose();
    /// 清除单例数据
    Get.delete<MyController>();
  }

Se precisar acessar os dados da próxima página, você precisa usar Get.find<T>()a função:

MyController controller = Get.find<MyController>();

Exibição de monitoramento de dados:

               GetBuilder(
                  init: controller,
                  builder: (_) {
    
    
                    return Column(
                      children: [
                        Text("${
      
      controller.number}"),
                        ElevatedButton(
                          child: const Text("Click"),
                          onPressed: () {
    
    
                            _.add();// 更新数据,上个页面的数据也会随之改变!!!
                          },
                        ),
                      ],
                    );
                  },
                )

Neste momento surgirá uma dúvida, ou seja, se você deseja criar dois modelos do mesmo tipo (ou seja, runtimeTypeiguais), como distingui-los? Neste momento, os parâmetros precisam ser usados tag, principalmente as três funções a seguir:

/// 添加依赖
MyController controller = Get.put(MyController(), tag: "one");
MyController controller = Get.put(MyController(), tag: "two");

/// 访问数据
MyController controller = Get.find<MyController>(tag: "one");
MyController controller = Get.find<MyController>(tag: "two");

/// 删除数据
Get.delete<MyController>(tag: "one");
Get.delete<MyController>(tag: "two");

O acima usa principalmente a função de gerenciamento de statusGetX de . Se você quiser usar sua função de gerenciamento de roteamento , precisará alterá-la para , o que não é necessário no momento . Por exemplo, a página :MaterialAppGetMaterialAppcontentpush

Get.to(() => const Page());

Supongo que te gusta

Origin blog.csdn.net/SSY_1992/article/details/131721414
Recomendado
Clasificación