Flutter中调用setState时如何保留动态生成TextFormField的值

一、单选按钮选中时保留TextFormField输入值 #

问题核心是setState()触发Widget重建后，动态生成的TextFormField若未持久化输入值，会回到初始状态。以下是两种可靠的解决方式：

1. 用TextEditingController管理每个输入框 #

如果是固定数量或可提前预估的动态输入框，可通过List存储控制器，确保重建时输入值被保留：

List<TextEditingController> _inputControllers = [];
int _selectedRadio = 0;

@override
void initState() {
  super.initState();
  // 初始化对应数量的控制器，示例为3个输入框
  _inputControllers = List.generate(3, (index) => TextEditingController());
}

@override
void dispose() {
  // 销毁控制器避免内存泄漏
  for (var controller in _inputControllers) {
    controller.dispose();
  }
  super.dispose();
}

// 单选按钮切换回调
void _onRadioChanged(int? value) {
  setState(() {
    _selectedRadio = value!;
  });
}

// 构建动态TextFormField
Widget _buildDynamicFields() {
  return Column(
    children: _inputControllers.map((controller) {
      return TextFormField(
        controller: controller,
        decoration: const InputDecoration(hintText: "请输入内容"),
      );
    }).toList(),
  );
}

控制器会持久化输入内容，即使setState()触发重建，TextFormField也会自动读取控制器内的值。

2. 用Map存储输入值（轻量场景） #

如果不需要控制器的监听、文本选择等额外功能，可通过Map绑定输入框的唯一标识（如索引）和对应值：

Map<int, String> _inputValues = {};
int _selectedRadio = 0;

// 单选按钮切换回调
void _onRadioChanged(int? value) {
  setState(() {
    _selectedRadio = value!;
  });
}

// 构建动态TextFormField
Widget _buildDynamicFields() {
  return Column(
    children: List.generate(3, (index) {
      return TextFormField(
        initialValue: _inputValues[index] ?? "",
        onChanged: (value) {
          setState(() {
            _inputValues[index] = value;
          });
        },
        decoration: const InputDecoration(hintText: "请输入内容"),
      );
    }),
  );
}

每次输入变化时更新Map内的值，重建时通过initialValue将值回传给输入框，注意必须用?? ""兜底避免null值。

二、解决initialValue导致屏幕空白的问题 #

屏幕空白通常是initialValue取值异常导致的Widget构建失败，可通过以下方式修复：

1. 确保initialValue有合法初始值 #

绝对不能让initialValue为null，必须提供默认值（如空字符串），否则会触发Widget构建错误，导致屏幕空白。

2. 避免同时设置controller和initialValue #

如果使用TextEditingController管理输入框，不能同时设置controller和initialValue，两者冲突会直接报错。如需设置初始值，应在控制器初始化时传入：

// 错误写法：同时设置controller和initialValue
TextFormField(
  controller: _controller,
  initialValue: "初始内容", // 此处会触发报错
)

// 正确写法：通过控制器设置初始值
@override
void initState() {
  super.initState();
  _controller = TextEditingController(text: "初始内容");
}

3. 检查动态生成逻辑 #

如果根据单选按钮状态动态增减输入框数量，要保证新增输入框的initialValue能正确获取到对应值（或兜底为空字符串），避免因未定义的取值导致构建异常。

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