Flutter 从 Api 获取数据答案

【问题标题】：Flutter fetch Data from ApiFlutter 从 Api 获取数据
【发布时间】：2021-06-27 15:48:51
【问题描述】：

我正在尝试从 Api 获取数据，但出现以下错误：

未处理的异常：类型“_InternalLinkedHashMap”不是类型“列表”的子类型

我从具有不同 Api 的视频中复制了代码，并且它工作正常。所以我猜这是定义的 API (https://api.radioking.io/widget/radio/leipzig-beatz/track/current) 的问题。

看起来错误发生在这一行：

                 setState(() {
                   users = items;
                 isLoading = false;
                });

这是代码：

      List users = [];
      bool isLoading = false;
      @override
      void initState() {
        // TODO: implement initState
        super.initState();
        this.fetchUser();
      }

      fetchUser() async {
        setState(() {
          isLoading = true;
        });
        var url =
            "https://api.radioking.io/widget/radio/leipzig-beatz/track/current";
        var response = await http.get(url);
        // print(response.body);
        if (response.statusCode == 200) {
          var items = json.decode(response.body);
          setState(() {
            users = items;
            isLoading = false;
          });
        } else {
          users = [];
          isLoading = false;
        }
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text("Listing Users"),
          ),
          body: getBody(),
        );
      }

      Widget getBody() {
        if (users.contains(null) || users.length < 0 || isLoading) {
          return Center(child: CircularProgressIndicator());
        }
        return ListView.builder(
            itemCount: users.length,
            itemBuilder: (context, index) {
              return getCard(users[index]);
            });
      }

      Widget getCard(item) {
        var title = item['title'];
        return Card(
          elevation: 1.5,
          child: Padding(
            padding: const EdgeInsets.all(10.0),
            child: ListTile(
              title: Row(
                children: <Widget>[
                  SizedBox(
                    width: 20,
                  ),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      SizedBox(
                          width: MediaQuery.of(context).size.width - 140,
                          child: Text(
                            title,
                            style: TextStyle(fontSize: 17),
                          )),
                      SizedBox(
                        height: 10,
                      ),
                    ],
                  )
                ],
              ),
            ),
          ),
        );
      }

【问题讨论】：

标签： api flutter

【解决方案1】：

将List users = []; 转换为Map<String,String> user = {} 然后通过调用var title = user['title']; 获取标题

【讨论】：

【解决方案2】：

您的 api 的响应是这样的

{"artist":"PHILBEAT","title":"BRINGING THE FUTURE","album":null,"started_at":"2021-03-31T15:02:27+0000","end_at":"2021-03-31T16:02:20+0000","next_track":"2021-03-31T16:02:21+0000","duration":3592.21,"buy_link":null,"is_live":false,"cover":"https://image.radioking.io/radios/336664/cover/custom/98df4bc3-9dca-4e17-b1c5-35e3116800e8.jpeg","default_cover":false,"forced_title":false}

这是一个 json 响应。您正在使用 dart::convert 库的 json.decode 函数来转换 json 响应，该响应返回 Map 类型的地图。

var items=json.decode(response.body)

items 是您分配给类型 List users 的 Map。因此您需要首先将用户类型更改为 Map

【讨论】：

【解决方案3】：

由于var items = json.decode(response.body); 返回带有 api 响应的 Map，因此您不能将其分配给 users 变量，即 List

将您的变量类型更改为：

Map<String, dynamic> users = {};

【讨论】：