如何在Flutter中使用多个getx控制器？

7lrncoxx 于 2023-03-03 发布在 Flutter

关注(0)|答案(2)|浏览(429)

我想知道如何在flutter中使用多个getx控制器。
即使数据有更新，也不能真实的反映。
并且Getbuilder只能使用一个控制器。
你能给予我举个代码的例子吗？

代码示例

class Controller1 extends GetxController {
  int counter = 0;

  void addCounter() {
    counter++;
    update();
  }
}

class Controller2 extends GetxController {
  int counter = 0;

  void addCounter() {
    counter++;
    update();
  }
}

class CounterView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    Controller1 controller1 = Get.find();
    Controller2 controller2 = Get.find();

    return Text(
      '${controller1.counter} / ${controller2.counter}'
    );
  }
}

class CounterButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    Controller1 controller1 = Get.find();
    Controller2 controller2 = Get.find();

    return Column(
      children: [
        GestureDetector(
          onTap: () => controller1.addCounter(),
          child: ...
        );
        GestureDetector(
          onTap: () => controller2.addCounter(),
          child: ...
        );
      ]
    );
  }
}

flutter

来源：https://stackoverflow.com/questions/69507529/how-to-use-multiple-getx-controllers-in-flutter

2条答案

按热度按时间

cnwbcb6i1#

我有另一个解决办法。

import 'package:flutter/material.dart';
import 'package:get/get.dart';

class Controller1 extends GetxController {
  int counter = 0;

  void addCounter() {
    counter++;
    update();
  }
}

class Controller2 extends GetxController {
  int counter = 0;

  void addCounter() {
    counter++;
    update();
  }
}

class CounterView extends GetView {
  const CounterView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Get.put(Controller1());
    Get.put(Controller2());
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: Column(
          children: [
            GetBuilder<Controller1>(
              builder: (controller1) => GestureDetector(
                onTap: () => controller1.addCounter(),
                child: const Text(
                    //controller1.counter.toString(),
                    "Controller-1"),
              ),
            ),
            GetBuilder<Controller2>(
              builder: (controller2) => GestureDetector(
                onTap: () => controller2.addCounter(),
                child: const Text(
                    //controller2.counter.toString(),
                    "Controller-2"),
              ),
            ),
            const SizedBox(
              height: 10,
            ),
            GetBuilder<Controller1>(
              builder: (controller1) => GetBuilder<Controller2>(
                builder: (controller2) => Column(
                  children: [
                    Text(
                      "Controller-1 = " + controller1.counter.toString(),
                    ),
                    Text(
                      "Controller-2 = " + controller2.counter.toString(),
                    ),
                    Text(
                      "C1 / C2 = " +
                          (controller1.counter / controller2.counter)
                              .toString(),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

更新：-使用Obx@无状态小部件

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() {
  runApp(
    GetMaterialApp(
      home: MyWidget(),
    ),
  );
}
class Controller1 extends GetxController {
  final counter = 0.obs;
  void addCounter() {
    counter.value++;
  }
}

class Controller2 extends GetxController {
  final counter = 0.obs;
  void addCounter() {
    counter.value++;
  }
}
class MyWidget extends StatelessWidget {
  MyWidget({super.key});
  final controller1 = Get.put(Controller1());
  final controller2 = Get.put(Controller2());
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Obx(() => (
        Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              GestureDetector(
                onTap: () => controller1.addCounter(),
                child: const Text(
                    //controller1.counter.toString(),
                    "Controller-1"),
              ),
              const Divider(),
              GestureDetector(
                onTap: () => controller2.addCounter(),
                child: const Text(
                    //controller1.counter.toString(),
                    "Controller-2"),
              ),
              const Divider(),
              Text(
                "Controller-1 = ${controller1.counter.value}",
              ),
              Text(
                "Controller-2 = ${controller2.counter.value}",
              ),
              Text(
                "C1 / C2 = ${controller1.counter.value / controller2.counter.value}",
              ),
            ],
          ),
        )
      )),
    );
  }
}

赞(0）回复(0）举报 2023-03-03

oknwwptz2#

1.请记住，如果使用GetBuilder（），则必须在执行某些操作后手动更新控制器状态。
1.在函数的构建方法中初始化控制器并不是一个好主意，你应该把它们放在只初始化一次的地方（构建方法之外）
1.如果小部件中使用了多个控制器，则应考虑使用Obx（（）{return Widget}）方法。
阅读更多关于getx here状态管理的信息

赞(0）回复(0）举报 2023-03-03

我来回答

如何在Flutter中使用多个getx控制器？

代码示例

2条答案

相关问题

热门标签

最新问答