Question

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

我得到的错误：

getter'length'被调用为null。
接收者：null
尝试致电：长度

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天了，我不知道问题出在哪里对不起，如果代码太多。预先谢谢你

Answer 1

此处是此代码部分，

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

添加PostListView(posts:snapshot.data)

告诉我是否可行。

从api提取数据并显示时出错

1 个答案: