编码列表<dynamic>无法映射到表行颤振

Question

我想在TableRow中显示映射列表。jsonlistMap具有以下格式，键和键值周围没有引号：

[
{
"item1": "value1",
},
{
"item2": "value2",
},
{
"item3": "value3",
},
]

我正在获取这个对象列表，变量listMap包含这种没有引号的json格式。

Container(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.all(25),
child: SingleChildScrollView(
child: Table(
columnWidths: const {
0: FixedColumnWidth(50),
1: FlexColumnWidth(),
},
children: (widget.listMap)
.map((object) {
return TableRow(children: [
Container(
color: (widget.listMap)
.indexOf(object) %
2 ==
0
? const Color(0xFF161616)
: Colors.grey[800],
padding: const EdgeInsets.all(15),
child: Text(
object['item1'].toString(),
style: TextStyle(color: Colors.white),
)),
]);
}).toList(),
border: TableBorder.all(
width: 1, color: Color(0xFF161616)),
),
),
))

我得到错误："List"不是类型为"List"的子类型. This is becauseTableRow`不识别没有引号的json键和值。

我该如何解决此问题？

编辑

所以用引号编辑json是因为人们发现为什么使用没有引号的json键和值很困惑，但这是我从变量widget.listMap中得到的格式

widget.listMap是json，但键和值周围没有引号，这就是我得到错误的原因：type 'List<dynamic>' is not a subtype of type 'List<TableRow>'编辑

这是获取json对象的代码：

class TestData {
Future<Map<String, dynamic>> getTestData() async {
String jsonData =
await rootBundle.loadString('assets/test_json/test_json1.json');
Map<String, dynamic> data = jsonDecode(jsonData);
return data;
}
}

编辑下面的代码显示listMap是从另一个小部件传递的，然后我将其作为List

class AppView extends StatefulWidget {
final List listMap;
const AppView({Key? key, required this.listMap}) : super(key: key);
@override
_AppBaseState createState() => _AppBaseState();
}

Answer 1

您的listMap是Map还是String？

如果它是地图，例如这样的东西：

final listMap = [
{'item1': 'value1'},
{'item2': 'value2'},
{'item3': 'value3'},
];

然后，您可以在小部件中使用它，方法是映射Map并使用object从listMap获取index。

children: listMap.map((object) {
final index = listMap.indexOf(object);
return TableRow(
children: [
Container(
color: index % 2 == 0 ? const Color(0xFF161616) : Colors.grey[800],
padding: const EdgeInsets.all(15),
child: Text(
object['item$index'].toString(),
style: TextStyle(color: Colors.white),
),
),
],
);
}).toList(),

如果是字符串，例如：

final listJsonString = "[{"item0":"value1"},{"item1":"value2"},{"item2":"value3"}]";

然后你必须首先从JSON中解码：

final parsedListJson = jsonDecode(listJsonString);
final listMap = List<Map<String, dynamic>>.from(parsedListJson.map((i) => Map<String, dynamic>.from(i)));

Answer 2

我试过了，没有错误：

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
List<Map<String,dynamic>> myListMap=[];
void loadJson() async {
myListMap= [await TestData().getTestData()];
setState(() {
});
}
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
loadJson();
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home:  MyHomePage(listMap: myListMap),
);
}
}
class MyHomePage extends StatefulWidget {
final List<Map<String,dynamic>> listMap;
const MyHomePage({Key? key, required this.listMap}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return  Container(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.all(25),
child: SingleChildScrollView(
child: Table(
columnWidths: const {
0: FixedColumnWidth(50),
1: FlexColumnWidth(),
},
children: (widget.listMap)
.map((object) {
return TableRow(children: [
Container(
color: (widget.listMap)
.indexOf(object) %
2 ==
0
? const Color(0xFF161616)
: Colors.grey[800],
padding: const EdgeInsets.all(15),
child: Text(
object['item1'].toString(),
style: TextStyle(color: Colors.white),
)),
]);
}).toList(),
border: TableBorder.all(
width: 1, color: Color(0xFF161616)),
),
),
));
}
}

class TestData {
Future<Map<String, dynamic>> getTestData() async {
String jsonData =
await rootBundle.loadString('assets/test_json1.json');
Map<String, dynamic> data = jsonDecode(jsonData);
return data;
}
}