从 api 获取数据并显示时出错答案

【问题标题】：Error fetching data from api and display it从 api 获取数据并显示时出错
【发布时间】：2020-11-22 18:55:22
【问题描述】：

我想从我的 restApi 发出一个 get 请求，然后在 listView 中显示数据，但由于某种原因它不起作用。

我得到的错误：

在 null 上调用了 getter 'length'。
收件人：空
尝试调用：长度

API 调用 (apiBaseHelper.dart)

 Future<List<Post>> getAllPosts() async {
final prefs = await SharedPreferences.getInstance();
final key = 'token';
final value = prefs.get(key) ?? 0;

final getPublishedPostUrl = "http://192.168.1.7:5000/post/all";
final response = await http.get(getPublishedPostUrl, headers: {
  'Accept': 'application/json',
  'Authorization': 'Bearer $value'
});
if (response.statusCode == 200) {
  List jsonResponse = json.decode(response.body);
  return jsonResponse.map((posts) => new Post.fromJson(posts)).toList();
} else {
  throw "something ";
}

}

PostListView

class PostListView extends StatelessWidget {
  final List<Post> posts;
  PostListView({Key key, this.posts}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: ListView.builder(
      itemCount: posts.length,
      itemBuilder: (context, index) {
        return Column(
          children: <Widget>[
            Container(
              constraints: BoxConstraints.expand(
                height:
                    Theme.of(context).textTheme.display1.fontSize * 1.1 + 200.0,
              ),
              color: Colors.white10,
              alignment: Alignment.center,
              child: Card(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    ListTile(
                      contentPadding: EdgeInsets.all(10.0),
                      title: new Text(posts[index].title),
                      leading: new Image.network(
                        posts[index].picture,
                        fit: BoxFit.cover,
                        height: 40.0,
                        width: 40.0,
                      ),
                      subtitle: Text(posts[index].category),
                    ),
                  ],
                ),
              ),
            ),
          ],
        );
      },
    ));
  }
}

homePage.dart

class HomePage extends StatefulWidget {
final ApiBaseHelper apiBaseHelper = ApiBaseHelper();

  @override
  State<StatefulWidget> createState() {
    return _HomePageState();
  }
}

class _HomePageState extends State<HomePage> {
  Future<List<Post>> futurePost;
  @override
  void initState() {
    super.initState();
    futurePost = ApiBaseHelper().getAllPosts();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.teal,
      body: new Padding(
        padding: EdgeInsets.fromLTRB(1.0, 10.0, 1.0, 10.0),
        child: FutureBuilder<List<Post>>(
          future: ApiBaseHelper().getAllPosts(),
          builder: (context, AsyncSnapshot<List<Post>> snapshot) {
            if (snapshot.hasError) {
              print(snapshot.error);
            }
            return snapshot.hasData
                ? PostListView()
                : Center(child: CircularProgressIndicator());
          },
        ),
      ),
    );
  }
}

我已经研究了 2 天，但我不知道问题到底出在哪里如果代码太多，我很抱歉。提前谢谢你

【问题讨论】：

标签： api flutter dart

【解决方案1】：

这里的代码部分，

  return snapshot.hasData
                ? PostListView()
                : Center(child: CircularProgressIndicator());

添加PostListView(posts:snapshot.data)

告诉我它是否有效。

【讨论】：