0

我通过使用 ListView.builder 生成 TextFormFields 构建了一个很长的表单。如果我只生成一些 TextFormFields，事情似乎工作正常，但是当我有很多它们时，当我单击底部的保存按钮时，它似乎只保存其中一些。

我想知道是否需要实现 async/await 之类的。

就功能而言，该表单非常标准。我引用了这个 repo，但我没有单独列出每个 TextFormField ，而是只有一个 Widget 函数并以这种方式构建一个 ListView 。

这是我的代码的样子（注意：实际上有大约 20 个变量，我只在下面的代码中列出了 5 个。另外，这是在一个有状态的小部件中）：

final _formKey = GlobalKey<FormState>();

String var1 = "";
String var2 = "";
String var3 = "";
String var4 = "";
String var5 = "";

List<String> _varListNames = [
  'var1',
  'var2',
  'var3',
  'var4',
  'var5'
];

Map myMap = {};

@override
Widget build(BuildContext context) {
  return SafeArea(
    child: Form(
      key: _formKey,
      child: ListView.builder(
          itemCount: _varListNames.length + 1,
          itemBuilder: (context, index) {
            return index == _varListNames.length
                ? buildSubmit()
                : experimentParameterWidget(
              paramMapKey: _varListNames[index],
              paramMap: myMap,
            ); // Text(expParamKeys[index])
          }),
    ),
  );
}

Widget myWidget({required String myKey, required myMap}) => TextFormField(
      decoration: InputDecoration(
        labelText: myKey,
        border: OutlineInputBorder(),
      ),
      validator: (value) {
        if (value!.length < 2) {
          return 'Enter at least 2 characters';
        }
      },
      onSaved: (value) {
        print("SAVING $myKey as $value");
        setState(() {
          myMap[myKey] = value;
        });
      },
    );

Widget buildSubmit() => Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        children: [
          ElevatedButton(
              onPressed: () {
                setState(() {
                  final isValid = _formKey.currentState!.validate();
                  if (isValid) {
                    print("IS VALID");
                    _formKey.currentState!.save();
                    final message = expParams;
                    final snackBar = SnackBar(
                      content: Text(
                        json.encode(message),
                        style: TextStyle(fontSize: 20),
                      ),
                      backgroundColor: Colors.green,
                    );
                    ScaffoldMessenger.of(context).showSnackBar(snackBar);
                  }
                });
                print('myMap: $myMap');
                print('expParams length: ${myMap.length}');
              },
              child: Text("Save")),
          Padding(
            padding: const EdgeInsets.symmetric(vertical: 24),
            child: ElevatedButton(onPressed: () {}, child: Text("Run")),
          ),
        ],
      ),
    );

这导致底部的一个小快餐栏显示 myMap 的一些键值对，终端中的 print 语句显示更多（不是相同的）。

我需要一份完整的清单。

最终目标是在另一个选项卡上显示 myMap 键/值对。

如果您需要更多说明，请告诉我。

谢谢你的帮助。

4

0 回答 0