-1

我遇到了与 TextFormField 相关的奇怪行为，因此我在父小部件中维护了一个对象列表，我使用以下代码呈现子小部件列表

 children: <Widget>[
                        ...childProfiles
                            .map((e) => ChildProfileCard(
                                childProfile: e,
                                removeChildProfile: removeChildProfile))
                            .toList(),

而ChildProfileCard包含一个TextFormField，代码如下

TextFormField(
                        decoration: const InputDecoration(
                          contentPadding: EdgeInsets.only(top: 0),
                          hintText: "Enter child's name",
                        ),
                        validator: (value) {
                          if (value == null || value.isEmpty) {
                            return 'Name is required';
                          }
                          return null;
                        },
                      ),

有一个“删除”功能，可以简单地从列表中删除其中一项，如下所示

setState(() {
      childProfiles = childProfiles
          .where((childProfile) => childProfile.id != childProfileToRemove.id)
          .toList();
    });

当有两个以上的项目（两个子小部件）时，我在第一个子小部件的TextFormField中输入了一些文本，然后我删除了第一个项目，文本将始终自动应用于第二个子小部件，我做错了什么? 我可以确认列表已正确更新，但文本表现异常。

在删除之前，您可以看到我们对不同的小部件有不同的文本 在删除之前，您可以看到我们对不同的小部件有不同的文本

删除后，第一个小部件的文本被错误地复制到下一个小部件，您可以看到 uuid 是第二个小部件的。 删除后，第一个小部件的文本被错误地复制到下一个小部件

4

1 回答 1

0

您应该在构建 ChildProfileCard 时使用任何唯一键

ChildProfileCard(key: Key(<ANY UNIQUE VALUE>),)

例子

ChildProfileCard(key: Key(e.id),)
于 2021-11-19T07:03:56.913 回答