Flutter如何显示FutureBuilder的snapshot.data？答案

【问题标题】：Flutter how do i display snapshot.data of FutureBuilder?Flutter如何显示FutureBuilder的snapshot.data？
【发布时间】：2021-07-25 14:27:06
【问题描述】：

我想显示来自 riot api 的召唤者数据，但是我收到了这个错误 '错误：不能无条件调用方法'[]'，因为接收者可以是'null'。在“return Text(snapshot.data['id'])”下出现红线。

所以我尝试使用“？”使其成为有条件的，但我仍然遇到同样的错误。有谁知道怎么处理？

我从中获取数据的 api：https://developer.riotgames.com/apis#summoner-v4/GET_getBySummonerName

FutureBuilder(
                future: getData(widget.value),
                builder: (context, snapshot) {
                  switch (snapshot.connectionState) {
                    case ConnectionState.none:
                      return Text('none');
                    case ConnectionState.active:
                      return Text('active');
                    case ConnectionState.waiting:
                      return Text('waiting,,,');
                    case ConnectionState.done:
                      return snapshot.hasData
                          ? Text(snapshot.data['id'])
                          : Text('N/A');
                    default:
                      return Text('default');

Future getData(String value) async {
    http.Response response =
        await http.get(Uri.parse('$summonerInfoUrl$value?api_key=$apiKey'));

    if (response.statusCode == 200) {
      String data = response.body;
      var decodeData = jsonDecode(data);
      return decodeData;
    } else {
      print(response.statusCode);
      return Text('error occured');
    }
  }

【问题讨论】：

标签： flutter flutter-futurebuilder

【解决方案1】：

您需要在方括号之前使用 null 感知运算符 !，这将强制值排除 null。但是，只有在您确定响应为 null 时才执行此操作，否则会引发错误。

如果您不确定它是否为空，请在括号前使用运算符?，在括号后使用?? 和一个备用值。例如。 snapshot.data?['id'] ?? 'No ID'.

【讨论】：