Flutter：多个小部件使用相同的 GlobalKey

Posted 2023-02-23

【中文标题】Flutter：多个小部件使用相同的 GlobalKey

【英文标题】：Flutter: Multiple widgets used the same GlobalKey

【发布时间】：2020-10-01 03:56:46

【问题描述】：

运行此代码时出现错误：Multiple widgets used the same GlobalKey. 所以我可以解决这个问题。 如何将键动态传递给我的 listview.Builder。有可能通过吗？这是我的代码的简化版本：

  GlobalKey<AutoCompleteTextFieldState<String>> key0 = new GlobalKey();

  @override
  Widget build(BuildContext context) 
    return M Scaffold(
        appBar: appBar,
        body: SingleChildScrollView(
          child: Container(
            child: ListView.builder(
               itemCount: 3,
               itemBuilder: (context, index) 
                return  SimpleAutoCompleteTextField(
                  key: key0,
                  suggestions: suggestions,
                  textChanged: (text) => print(text),
                  clearOnSubmit: false,
                  textSubmitted: (text) => print(text)
                ),
              
            ),
          ),
        ),

    );
  

【参考方案1】：

传递索引作为你的值

  key: ValueKey(index),

【讨论】：

可以分享AutoCompleteTextFieldState的代码吗？没有它对你帮助不大，但你必须在那个类中添加键，比如 SimpleAutoCompleteTextField(Key key,....)

这是一个包pub.dev/packages/autocomplete_textfield

错误是：无法将参数类型“ValueKey”分配给参数类型“GlobalKey>”。

你能解决这个问题吗？

【参考方案2】：

GlobalKey 在整个应用程序中必须是唯一的。

您不能同时在树中包含具有相同全局键的两个小部件。尝试这样做会在运行时断言。

这意味着多个元素不能使用同一个键。这是short video about keys in Flutter，而不是那么短的article about using keys，包括GlobalKey。

在这种情况下，您应该做的是从每个元素的唯一定义特征（例如内容或某些 ID）中派生出每个元素的键。

注意事项：

1.

Key('AAA') == Key('AAA'); // true

这意味着您不必在构建函数之外创建 Key 对象，只需：

return SimpleAutoCompleteTextField(
  key: Key(itemId),

在你的情况下，甚至更确切地说是ValueKey(itemData)：ValueKey。

GlobalKey 相对昂贵，如果您不明确需要将它们从应用程序的一个位置移动到另一个位置，则更喜欢常规的Key。

不要从索引派生键。这被认为是一种不好的做法，因为当您尝试对同一子树中的现有小部件重新排序时，它会导致行为不端。

【讨论】：

Key() 没有小部件大小和一些数据。哪个 globayKey 有。如果没有 gloableKey，我怎么能做到这一点