Flutter提交后Radio Button新值未更新问题咨询

• 状态未双向绑定：编辑页面初始化时，可能仅把待办的文本和优先级赋值给临时变量，但修改Radio按钮时，没有同步更新临时变量的优先级值，提交时自然用的还是旧值。
• 提交逻辑遗漏字段：提交时只更新了待办对象的文本内容，忘记把修改后的优先级值同步过去。
• UI未触发重绘：修改Radio选项时没有调用setState()，导致页面显示的选中状态没变化，也无法将新值同步到状态中。

下面用基础StatefulWidget实现修复，没有复杂状态管理，核心是做好状态绑定+提交时同步所有字段：

1. 定义简单的待办模型 #

class Todo {
  String id;
  String content;
  int priority; // 用数字区分优先级：1=低，2=中，3=高

  Todo({required this.id, required this.content, required this.priority});
}

2. 编辑页面核心代码 #

class TodoEditPage extends StatefulWidget {
  final Todo todo;
  final Function(Todo) onSave; // 保存回调，用于更新列表

  const TodoEditPage({super.key, required this.todo, required this.onSave});

  @override
  State<TodoEditPage> createState() => _TodoEditPageState();
}

class _TodoEditPageState extends State<TodoEditPage> {
  late TextEditingController _contentController;
  late int _selectedPriority; // 本地状态保存当前选中的优先级

  @override
  void initState() {
    super.initState();
    // 初始化：从传入的待办对象同步数据到本地状态
    _contentController = TextEditingController(text: widget.todo.content);
    _selectedPriority = widget.todo.priority;
  }

  @override
  void dispose() {
    _contentController.dispose();
    super.dispose();
  }

  void _saveTodo() {
    // 提交时：把本地状态的所有更新同步回待办对象
    final updatedTodo = Todo(
      id: widget.todo.id,
      content: _contentController.text,
      priority: _selectedPriority, // 务必传入更新后的优先级
    );
    widget.onSave(updatedTodo);
    Navigator.pop(context);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("编辑待办")),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            // 文本输入框
            TextField(
              controller: _contentController,
              decoration: const InputDecoration(labelText: "待办内容"),
            ),
            const SizedBox(height: 20),
            // 优先级Radio组
            const Text("优先级"),
            Row(
              children: [
                Radio(
                  value: 1,
                  groupValue: _selectedPriority, // 绑定本地状态
                  onChanged: (value) {
                    if (value != null) {
                      setState(() {
                        _selectedPriority = value; // 更新状态并触发UI重绘
                      });
                    }
                  },
                ),
                const Text("低"),
                Radio(
                  value: 2,
                  groupValue: _selectedPriority,
                  onChanged: (value) {
                    if (value != null) {
                      setState(() {
                        _selectedPriority = value;
                      });
                    }
                  },
                ),
                const Text("中"),
                Radio(
                  value: 3,
                  groupValue: _selectedPriority,
                  onChanged: (value) {
                    if (value != null) {
                      setState(() {
                        _selectedPriority = value;
                      });
                    }
                  },
                ),
                const Text("高"),
              ],
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: _saveTodo,
              child: const Text("保存"),
            )
          ],
        ),
      ),
    );
  }
}

关键修复点说明 #

• 初始化同步：在initState里把待办对象的内容和优先级同步到本地状态，确保编辑页面初始显示正确值。
• Radio绑定状态：每个Radio的groupValue绑定_selectedPriority，onChanged时调用setState()更新变量，既刷新UI选中状态，也保存新优先级。
• 提交全字段同步：保存时同时传递更新后的文本和优先级，确保待办对象完整更新。

列表页跳转编辑页示例 #

// 列表项点击跳转编辑页
GestureDetector(
  onTap: () {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => TodoEditPage(
          todo: todo, // 当前待办对象
          onSave: (updatedTodo) {
            // 更新列表中的待办项
            setState(() {
              final index = todos.indexWhere((t) => t.id == updatedTodo.id);
              if (index != -1) {
                todos[index] = updatedTodo;
              }
            });
          },
        ),
      ),
    );
  },
  child: ListTile(title: Text(todo.content)),
)

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