Flutter中如何在Text组件内每行显示Map键值对？

要实现需求中的展示效果，核心是将Map的键值对转换为带换行符的字符串，再传递给Text组件即可，下面是几种实用的实现方式：

方式一：forEach拼接字符串 #

这是最直观的写法，遍历Map的每个键值对并拼接成目标格式：

Map<String, dynamic> myMap = {'zero': 0, 'one': 1, 'two': 2};

String mapDisplayText = 'Map key-value pairs:\n';
myMap.forEach((key, value) {
  mapDisplayText += '$key: $value\n';
});

// 在Widget中使用
Text(mapDisplayText);

方式二：fold方法简洁拼接 #

通过fold方法可以更简洁地完成字符串拼接，避免额外的变量赋值操作：

Map<String, dynamic> myMap = {'zero': 0, 'one': 1, 'two': 2};

String mapDisplayText = myMap.entries.fold(
  'Map key-value pairs:\n',
  (currentText, entry) => '$currentText${entry.key}: ${entry.value}\n',
);

Text(mapDisplayText);

方式三：避免末尾多余换行 #

如果在意末尾多出来的换行符，可以先将键值对转为字符串列表，再用换行符连接：

Map<String, dynamic> myMap = {'zero': 0, 'one': 1, 'two': 2};

List<String> keyValueLines = myMap.entries
    .map((entry) => '${entry.key}: ${entry.value}')
    .toList();
String mapDisplayText = 'Map key-value pairs:\n' + keyValueLines.join('\n');

Text(mapDisplayText);

以上几种方式都能让Text组件按照需求每行显示一个Map的键值对，原理都是利用Flutter的Text组件会识别\n换行符来实现多行展示。

内容的提问来源于stack exchange，提问作者Zzz