Flutter动态生成TextField时列表元素重复问题求助

问题根源 #

你当前的代码里，recovered初始是一个长度为3的空字符串列表，而你在onSubmitted中使用了recovered.insert(index, value)方法——这个方法的作用是在指定索引位置插入新元素，而不是替换原有元素。每输入一个值，列表就会新增一个元素，原来的空字符串会被挤到后面，最终导致列表变成[1, 2, 4, "", "", ""]。

解决方案 #

方案1：直接替换列表元素

把insert操作改成直接给对应索引赋值，这样会覆盖掉初始的空字符串，列表长度始终保持和产品数量一致：

TextField(
  onSubmitted: (value) {
    // 替换insert为直接赋值
    recovered[index] = value;
    log("the value is $value");
    setState(() {});
  },    
  controller: myControllers[index],
  decoration: const InputDecoration(
    enabledBorder: OutlineInputBorder(
      borderSide: BorderSide(
        width: 1,
        color: Colors.grey
      )
    ),
  ),
),

方案2：通过控制器直接获取值（更推荐）

既然你已经为每个TextField配置了myControllers[index]，完全可以跳过维护recovered列表的步骤，直接通过控制器集合获取所有输入值，避免手动同步的错误：

// 当需要获取所有TextField的内容时，执行以下代码
List<String> allInputValues = myControllers.map((controller) => controller.text).toList();
// allInputValues 就是你要的 [1, 2, 4]

内容的提问来源于stack exchange，提问作者Victor Ayodeji Ogundola