在 flutter 上向我的本地主机发出 HTTP 请求不起作用

Question

我正在尝试从 api（格式为 json）中获取我的数据以显示在我的 flutter 应用程序中.

我是运行 android 工作室控制台中的这个错误

[VERBOSE-2:dart_error.cc(16)] Unhandled exception:
type '_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 
'List<dynamic>'

api 目前看起来像这样

{
    "error": false,
        "data": [
           {
              "name": "conner",
              "age": 24
            },
            {
              "name": "andrew",
              "age": 20
            }
         ],
         "message": "Todos list."
         }

我正在使用本教程，只是用我的 "name"、https://www.youtube.com/watch?v=-PRrdG163to

替换了他的值 "title"

这是我的代码运行

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;

void main() {
  runApp(new MaterialApp(
    home: new HomePage(),
  ));
}

class HomePage extends StatefulWidget {
  @override
  HomePageState createState() => new HomePageState();
}
class HomePageState extends State<HomePage> {

  Map<String,dynamic> data;

  Future<String> getData() async {
    var response = await http.get(
        Uri.encodeFull("http://10.1.0.109:8080/names"),
        headers: {
          "Accept": "application/json"
        }
    );

    this.setState(() {
      data = JSON.decode(response.body);
    });
    print (data[1]["data"]);

    return "Success!";
  }

  @override
  void initState() {
    super.initState();
    this.getData();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Listviews"),
      ),
      body: new ListView.builder(
        itemCount: data == null ? 0 : data["data"].length,
        itemBuilder: (BuildContext context, int index) {
          return new Card(
            child: new Text(data[index]["data"]),
          );
        },
      ),
    );
  }
}

Answer 1

问题出在你的 JSON 文件的结构上，它与教程中的不一样，所以试试这个

data["data"][1]["name"]

NOTE :

将数据从 list 更改为 var 或 Map<String,dynamic>

Map<String,dynamic> data;

之后您需要获取列表长度，因此在 itemCount 中将其更改为

itemCount: data == null ? 0 : data["data"].length,

Full Example

在 flutter 上向我的本地主机发出 HTTP 请求不起作用

Making HTTP request to my localhost on flutter not working

mysql

http-get

node.js

express

flutter