如何在颤动中将 json 数据转换为 List<widgets>？

Posted 2023-02-23

【中文标题】如何在颤动中将 json 数据转换为 List<widgets>？

【英文标题】：How to convert a json data into a List<widgets> in flutter?

【发布时间】：2021-04-28 11:45:48

【问题描述】：

a sample of what i have in mind

var url = 'https://www.googleapis.com/books/v1/volumes?q=egg';

Future<BookResponse> getData() async 
  var response = await http.get(url);
  var responseBody = jsonDecode(response.body);
  // print(responseBody);

  return BookResponse.fromJson(responseBody);


-----

 FutureBuilder<BookResponse>(
            future: getData(),
            builder: (BuildContext context, AsyncSnapshot snapshot) 
              if (snapshot.hasError) print(snapshot.error);
              if (snapshot.hasData) 
                return ListView.builder(
                    itemCount: snapshot.data.items.length,
                    itemBuilder: (context, index) 
                      return Card(
                          child: ListTile(
                        title:
                            Text(snapshot.data.items[index].volumeInfo.title),
                      ));
                    );
               else
                return Center(child: CircularProgressIndicator());
            ,
          )

我正在尝试创建一种将 json 映射转换为 List<widgets> 的方法，以便我可以使用它来显示项目。

我找不到将项目显示为行和列的方法。

是否可以使用FutureBuilder 拥有多个小部件？ （例如，一行书籍和另一行显示作者）

如果是这样，我会避免将其转换为List<widgets>

【参考方案1】：

将 JSON 数据转换为对象并：

Row(
  children: entities.map((entity) => Text(entity.text)).toList();
),

它创建一个带有小部件的列表。

【讨论】：

我已经用对象映射它们，我试图将它们显示为一行而不是一个列表

Row(children: snapshot.data.items .map((entity) => Text(entity.text)) .toList(), ) 它仍然没有显示。我需要更改实体吗？如果我在文本中单独调用项目（snapshot.data.items[0].title），它工作得很好

不显示或项目显示不正确？

可以加截图吗？

我把它们排成一行：Row( children: [ for (var i = 0; i < snapshot.data.items.length; i++) Text(snapshot.data.items[i].id) ], )