从 List.map() 获取迭代索引

我在字母列表上编写了一个迭代，并使用“地图”类将内部卡片放在屏幕上。

在代码中，您可以看到我做了一行，并使用“map”将卡片上的所有用户板打印到屏幕上。我想在里面添加一些逻辑，所以我需要获取元素的 id（用于录制事件）。 有什么办法可以做到这一点吗？

实际上，我想通过 userBoard 获取元素的特定索引。

Code:

Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
            Row(
              children: userBoard
                  .map((element) => Stack(children: <Widget>[
                        Align(
                          alignment: Alignment(0, -0.6),
                          child: GestureDetector(
                            onTap: (() {
                              setState(() {
                                // print("element=${element.toString()}");
                                // print("element=${userBoard[element]}");
                              });
                            }),
                            child: SizedBox(
                              width: 40,
                              height: 60,
                              child: Card(
                                  shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(5.0),
                                  ),
                                  child: Center(
                                    child: Text(element,
                                        style: TextStyle(fontSize: 30)),
                                  )),
                            ),
                          ),
                        )
                      ]))
                  .toList(),
            )
          ],
        ),
}

Picture- 每张卡都是地图的“元素”。我想获取 onTap 函数的索引。 https://i.stack.imgur.com/2rzap.png

要访问索引，您需要使用以下命令将列表转换为地图：asMap https://api.dartlang.org/stable/2.2.0/dart-core/List/asMap.html操作员。

Example

final fruitList = ['apple', 'orange', 'mango'];
final fruitMap = fruitList.asMap(); // {0: 'apple', 1: 'orange', 2: 'mango'}

// To access 'orange' use the index 1.
final myFruit = fruitMap[1] // 'orange'

// To convert back to list
final fruitListAgain = fruitMap.values.toList();

你的代码

userBoard.asMap().map((i, element) => MapEntry(i, Stack(
  GestureDetector(onTap: () {
    setState(() {
      // print("element=${element.toString()}");
      // print("element=${userBoard[i].toString()}");
    });
  }),
))).values.toList();

参考其他答案

• I like 这个答案 https://stackoverflow.com/a/58444027/272539更好的。请看一下。
• 如果你想在多个地方尝试扩展像这样 https://stackoverflow.com/a/60502389/272539.
• 或者，您也可以尝试飞镖收集方法 https://stackoverflow.com/a/68357576/272539.