列表项的颤振状态更新

Posted 2023-03-07

【中文标题】列表项的颤振状态更新

【英文标题】：Flutter state update for list items

【发布时间】：2021-08-15 15:28:19

【问题描述】：

我在我的应用程序中使用 getX 进行状态管理。模型文件包含项目列表，我想更新项目，但更新后的值不会在更改时更新。

查看代码：

body: ListView.builder(
          itemCount: _antigens.fungus.length,
          itemBuilder: (context, index) 
            return ListTile(
                title: Text(_antigens.fungus[index]['name']),
                onTap: () 
                  controller.updateValue(context, index);
                );
          ),

控制器：

updateValue(BuildContext context, int index) async 
    showDialog(
        context: context,
        builder: (context) 
          return AlertDialog(
            title: const Text('Enter a value'),
            content: TextField(
              controller: controller,
              keyboardType: TextInputType.number,
            ),
            actions: [
              ElevatedButton(
                onPressed: () 
                  _antigen.fungus[index]['value'] = controller.text;
                  Get.back();
                ,
                child: const Text('Ok'),
              )
            ],
          );
        );
  

查看以显示更新的值：

return Center(
      child: Text(antigens.fungus[0]['value'].toString()),
    );

【参考方案1】：

对我来说更新列表视图的工作是这段代码：

 @override
 Widget build(BuildContext context) 
  return GetX<CarItemsController>(
  init: CarItemsController(),
  builder: (controller) ); 
 

只需将您的 ProductController() 放在 GetX 小部件的 init 参数中即可。

【参考方案2】：

GetX 提供了两种更新用户界面的方法。

反应式状态管理器

这样您需要通过在值末尾添加“.obs”来将变量定义为Rx，例如：

final myBool = true.obs; // creates a RxBool
final myList = [].obs; // creates a RxList
final myString = 'sajad'.obs; // creates a RxString

然后用Obx 小部件将小部件在您使用此反应变量的位置包装起来，例如

final isLoading = false.obs // in controller

return Obx(                 // in build method
       () => Visibiliy(
               visible: isLoading
               child: CircularProgressIndicator()
          )
       );

然后你可以使用isLoading.value = true将状态更改为加载

GetBuilder 状态管理器

使用这种方式，您可以像往常一样声明变量，但在 UI 中，您需要包装要重建 GetBuilder 并为其指定 GetxController 的小部件，例如：

class MyController extends GetxController
   bool isLoading = false;

然后在 UI 中将需要重建的小部件包装在 GetBuilder<MyController> 中

return GetBuilder<MyController>(        // in build method
       builder: (controller) => Visibiliy(
               visible: controller.isLoading
               child: CircularProgressIndicator()
          )
       );

然后要重建 UI，请致电 update() 或 MyController

// inside of controller
isLoading = true;
update();