GetX 颤振状态未更新

我是新来的。我刚开始使用 GetX 颤振包。我正在开发一个待办事项列表应用程序。我在更新小部件状态时遇到问题。我所做的是我创建了一个 AddTaskController ,只要单击 Add item 按钮,它就会更新 listView 状态。每个列表项都包含一个复选框。问题是我无法在单击复选框时更新列表项的状态。这是代码:AddTaskController

class AddTaskController extends GetxController {

  RxList<TaskItem> toDoTasksList = RxList([]);

  addTask(TaskItem taskItem) {
    toDoTasksList.add(taskItem);
  }

  removeTask(TaskItem taskItem) {
    toDoTasksList.remove(taskItem);
  }
}

添加任务屏幕

  • 添加任务按钮

    
    
    ElevatedButton.icon(
      onPressed: () {
        TaskItem taskItem = TaskItem(
          taskStatus: TASK_STATUS.TODO,
          isChecked: false,
          taskName: title,
        );
        addTaskController.addTask(taskItem);
      },
      icon: Icon(Icons.add),
      label: Text('Add Item'),
      style: ElevatedButton.styleFrom(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(12),
        ),
      ),
    );

*   列表显示
Expanded(
  child: Obx(
    () => ListView.builder(
      itemBuilder: (context, index) {
        return TaskCheckItem(
          value: addTaskController.toDoTasksList[index].isChecked,
          title: addTaskController.toDoTasksList[index].taskName,
          onChanged: (newValue) {
            print(newValue);
            addTaskController.toDoTasksList[index].setChecked(newValue);
          },
          onDownloadClicked: () {},
          onDeleteClicked: () {},
        );
      },
      itemCount: addTaskController.toDoTasksList.length,
    ),
  ),
);
stack overflow GetX flutter state is not being updated
原文答案

答案:

作者头像

要更新您必须添加到列表 toDoTasksList.add(taskItem); 的值的状态,这不会更新状态

toDoTasksList.value.add(taskItem); 这将更新状态

如果它不起作用而不是使用 RxList<TaskItem> toDoTasksList = RxList([]);

只需使用 RxList<TaskItem> toDoTasksList = <TaskItem>[].obs;

我希望这可以帮助你

作者头像

更新 Rx 变量的值后总是调用 refresh() 方法。

而不是这个


  addTask(TaskItem taskItem) {
    toDoTasksList.add(taskItem);
  }

  removeTask(TaskItem taskItem) {
    toDoTasksList.remove(taskItem);
  }

尝试这个,

  addTask(TaskItem taskItem) {
    toDoTasksList.add(taskItem);
    toDoTaskList.refresh();     //<----- refresh() call
}

  removeTask(TaskItem taskItem) {
    toDoTasksList.remove(taskItem);
     toDoTaskList.refresh();    //<----- refresh() call
  }
作者头像

更新 AddTaskController 中列表的类型

class AddTaskController extends GetxController {

  final toDoTasksList = Rx<List<TaskItem>>([]);

  addTask(TaskItem taskItem) {
    toDoTasksList.value.add(taskItem);
  }

  removeTask(TaskItem taskItem) {
    toDoTasksList.value.remove(taskItem);
  }
}
  • AddTaskButton 无需更改

更新 ListView 中的回调,以便更新状态

    Expanded(
      child: Obx(
        () => ListView.builder(
          itemBuilder: (context, index) {
            return TaskCheckItem(
              value: addTaskController.toDoTasksList.value[index].isChecked,
              title: addTaskController.toDoTasksList.value[index].taskName,
              onChanged: (newValue) {
                print(newValue);
                // call update() when changing state of list object
                addTaskController.toDoTasksList.update((value) {
                  value![index].setChecked(newValue);
                },
              },
              onDownloadClicked: () {},
              onDeleteClicked: () {},
            );
          },
          itemCount: addTaskController.toDoTasksList.value.length,
        ),
      ),
    );

这个关于获取状态管理和列表的 note 可能会有所帮助

作者头像

最后在 addTask 方法中调用 update()。

作者头像

请使用这个。

class AddTaskController extends GetxController {

    var _toDoTasksList = [].obs;
    List<TaskItem> get toDoTasksList => [..._toDoTasksList];

    addTask(TaskItem taskItem) {
    _toDoTasksList.add(taskItem);
  }

   removeTask(TaskItem taskItem) {
   _toDoTasksList.remove(taskItem);
  }
}
作者头像

如果你使用 RxList 并且你想强制更新页面的状态,你需要使用你的 RxList.refresh() 来通知监听器有关更改。