TLDR:所有小部件都应有一个
Key keyas 可选 参数或其构造函数。
Key是flutter引擎在识别列表中的哪个小部件已更改的步骤中使用的东西。
当您具有可能会被删除/插入 的相同类型 的小部件 列表 (
Column,
Row无论如何)时,此功能很有用。 __
假设您有此代码(代码不起作用,但是您知道了):
AnimatedList( children: [ Card(child: Text("foo")), Card(child: Text("bar")), Card(child: Text("42")), ])潜在地,您可以通过滑动分别删除所有这些小部件。
事实是,当删除一个孩子时,我们的列表中有一个动画。因此,让我们删除“酒吧”。
AnimatedList( children: [ Card(child: Text("foo")), Card(child: Text("42")), ])问题:如果没有
Key,则flutter将无法知道您的第二个元素是否
Row消失了。或者,如果它是最后一个消失了,而第二个则改变了孩子。
因此
Key,如果没有,您可能会遇到一个错误,即您的 请假 动画将在最后一个元素上播放!
这就是
Key发生的地方。
如果我们再次开始我们的示例,使用键,我们将有:
AnimatedList( children: [ Card(key: ObjectKey("foo"), child: Text("foo")), Card(key: ObjectKey("bar"), child: Text("bar")), Card(key: ObjectKey("42"), child: Text("42")), ])注意键 不是 子索引,而是元素唯一的键。
从这一点来说,如果我们再次删除“ bar”,我们将拥有
AnimatedList( children: [ Card(key: ObjectKey("foo"), child: Text("foo")), Card(key: ObjectKey("42"), child: Text("42")), ])由于
key存在,Flutter引擎现在可以确定删除了哪个小部件。现在,我们的 请假 动画将正确在“ bar”而不是“ 42”上播放。



