复选框列表不会在颤振 getx 中更新

Question

我在 Flutter 项目中使用 GetX 进行状态管理。我的问题是当我单击复选框时，它会更新控制器中的状态，但不会在 UI 中显示结果。一般来说，改变的状态也应该改变 UI。我不确定是什么问题，但我认为在 getx 中使用 observable 变量存在错误。如何解决这个问题呢？如果帖子不清楚，请问我。

这是视图。

class FilterBottomSheetWidget extends GetView<SearchController> {
@override
Widget build(BuildContext context) {
  return Container(
  height: Get.height - 90,
  child: Stack(
    children: <Widget>[
      Padding(
        padding: const EdgeInsets.only(top: 80),
        child: Container(
          padding: EdgeInsets.only(top: 20, bottom: 15, left: 4, right: 4),
          child: controller.expiringContractStatus.isEmpty ? CircularLoadingWidget(height: 100)
            : SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: ExpansionTile(
                      title: Text("Contract Status".tr, style: Get.textTheme.bodyText2),
                      children: List.generate(controller.expiringContractStatus.length, (index) {
                        var _expiringContractStatus = controller.expiringContractStatus.elementAt(index);
                        return CheckboxListTile(
                          controlAffinity: ListTileControlAffinity.trailing,
                          value: _expiringContractStatus["isCheck"], // ************
                          onChanged: (value) {
                            controller.itemChange(value, index); // ************
                            controller.update();
                          },
                          title: Text(
                            _expiringContractStatus["title"],
                            style: Get.textTheme.bodyText1,
                            overflow: TextOverflow.fade,
                            softWrap: false,
                            maxLines: 1,
                          ),
                        );
                      }),
                      initiallyExpanded: true,
                    );
                  }                   
            )
        ),
      ),
     // more widgets
    ],
  ),
);
 }
 }

这是 SearchController。

class SearchController extends GetxController {
final expiringContractStatus = <Map>[
  {
    "title": "aaa",
    "isCheck": false
  },
  {
    "title": "bbb",
    "isCheck": false
  },
  {
    "title": "ccc",
    "isCheck": false
  }        
].obs;

@override
void onInit() async {
  await refreshSearch();
  super.onInit();
}

void itemChange (bool value, int index) {
  expiringContractStatus[index]["isCheck"] = value; // *************
  update();
}
}

Answer 1

更新答案：

如果您尝试包装 Obx 并且它不起作用，请改用 GetBuilder<SearchController>。

GetBuilder<SearchController>(
    builder: (_) =>  controller.expiringContractStatus.isEmpty ? CircularLoadingWidget(height: 100)
            : SingleChildScrollView(...))

当您调用update() 时，无论如何都会触发重建，并使用更新的值。我能想到Obx 不起作用的唯一原因是，当涉及到列表时，可能只响应列表中项目的添加或删除，而不是嵌套在其中的属性的更改。

一般来说，您可能会发现在大多数情况下使用基于可观察流的变量并不是真正需要的。 GetBuilder 可以处理您需要完成的大部分或全部工作，除非您正在做一些基于流的事情（例如绑定到外部 Firebase 集合）。两者都没有错，但GetBuilder 是性能最高的选项，因为流本质上要贵一些。

原答案：

我建议您在声称其他人的代码中存在错误之前阅读有关正确使用的文档。这适用于您正在使用的任何软件包。

在Readme 和基本计数器应用程序示例中都声明了可观察变量需要放置在Obx 小部件中，否则不会根据可观察 GetX 变量的更新状​​态触发重建。

Container 的孩子应该是

Obx(() => controller.expiringContractStatus.isEmpty ? CircularLoadingWidget(height: 100)
            : SingleChildScrollView(...))