Flutter：使用自定义对象作为Getx Observable时如何避免重渲染

针对你遇到的问题，有两种高效的解决方式，无需将每个字段单独设为可观察对象：

方法一：使用GetBuilder配合指定更新ID #

这种方式可以精确控制只有目标Widget在字段更新时重建：

1. 修改控制器中的更新逻辑，调用update时传入ids参数标记更新的字段：

class TodoController extends GetxController{
  final Todo todo = Todo().obs;

  void updateName(String newName) {
    todo.value.name = newName;
    // 指定仅更新标记为'name'的Widget
    update(['name']);
  }

  // 同理，其他字段的更新方法也可以对应添加id
  void updateNote(String newNote) {
    todo.value.note = newNote;
    update(['note']);
  }
}

2. 在对应的Widget中使用GetBuilder并指定id，只有匹配id的Widget会在对应字段更新时重建：

// 显示/编辑name的Widget
GetBuilder<TodoController>(
  id: 'name',
  builder: (controller) {
    return TextField(
      controller: nameController,
      onChanged: (value) => controller.updateName(value),
      decoration: InputDecoration(labelText: '名称'),
    );
  },
)

// 显示/编辑note的Widget
GetBuilder<TodoController>(
  id: 'note',
  builder: (controller) {
    return TextField(
      controller: noteController,
      onChanged: (value) => controller.updateNote(value),
      decoration: InputDecoration(labelText: '备注'),
    );
  },
)

方法二：让Todo类继承Getx并使用内部Rx字段 #

将Todo类改造为Getx子类，内部字段使用Rx类型，这样既可以保持对象的整体性，又能单独监听某个字段：

1. 修改Todo类：

class Todo extends Getx {
  final RxString name = ''.obs;
  final RxString note = ''.obs;
  final Rx<DateTime> date = DateTime.now().obs;
  final RxString color = ''.obs;
  final RxBool isDone = false.obs;
}

2. 控制器中只需持有Todo实例：

class TodoController extends GetxController{
  final Todo todo = Todo();
}

3. 在Widget中单独监听目标字段，只有该Widget会在对应字段变化时重建：

// 仅监听name字段的Widget
Obx(() => TextField(
  controller: nameController,
  onChanged: (value) => controller.todo.name.value = value,
  decoration: InputDecoration(labelText: '名称'),
))

// 仅监听isDone字段的Widget
Obx(() => Checkbox(
  value: controller.todo.isDone.value,
  onChanged: (value) => controller.todo.isDone.value = value!,
))

这两种方式都能避免不必要的Widget重建，同时保持代码的简洁性。

内容的提问来源于stack exchange，提问作者Praveena