English 中文(简体)
清单
原标题:List with 0 items after fetch
  • 时间:2023-09-16 16:55:48
  •  标签:
  • flutter
  • dart
import  dart:convert ;

import  package:http/http.dart  as http;
import  package:trilhaapp/model/post_model.dart ;

class PostsRepository {
  Future<List<PostModel>> fetchPosts() async {
    var response = await http.get(Uri.parse( https://jsonplaceholder.typicode.com/posts ));
    if (response.statusCode == 200) {
      var postList = jsonDecode(response.body);
      return (postList as List).map((e) => PostModel.fromJson(e)).toList();
    } else {
      throw Exception( Failed to load post );
    }
  }
}

body: ListView.builder(
  itemCount: posts.length,
  itemBuilder: (_, index) {
    var post = posts[index];

当我试图填满这一名单时,项目Count为零,但我确实是注定的。

我错了吗?

问题回答

请将此提及:

import  dart:convert ;

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

class PostApiFetchScreen extends StatefulWidget {
  const PostApiFetchScreen({super.key});

  @override
  State<PostApiFetchScreen> createState() => _PostApiFetchScreenState();
}

class _PostApiFetchScreenState extends State<PostApiFetchScreen> {
  final String _postApiFetchUrl =  https://jsonplaceholder.typicode.com/posts ;
  var postList = null;

  void postApiGetMethod() async {
    var response = await http.get(
      Uri.parse(_postApiFetchUrl),
    );

    if (response.statusCode == 200) {
      var responseBody = jsonDecode(response.body);
      print( Response data is ${responseBody.length} );
      postList = responseBody;
      setState(() {});
    }
  }

  @override
  void initState() {
    super.initState();
    postApiGetMethod();
  }

  Widget postContainer({
    required String title,
    required String body,
    required int id,
  }) {
    return Column(
      children: [
        const Divider(
          height: 2,
        ),
        postInfoTile(
          key:  ID ,
          pair: id.toString(),
        ),
        const SizedBox(
          height: 10,
        ),
        postInfoTile(
          key:  Title ,
          pair: title,
        ),
        const SizedBox(
          height: 10,
        ),
        postInfoTile(
          key:  Body ,
          pair: body,
        ),
        const SizedBox(
          height: 3,
        ),
        const Divider(
          height: 2,
        ),
      ],
    );
  }

  Widget postInfoTile({
    required String key,
    required String pair,
  }) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
           $key: ,
          style: const TextStyle(
            fontWeight: FontWeight.w900,
          ),
        ),
        const SizedBox(width: 20),
        Expanded(child: Text(pair)),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(
           Post API Consume ,
        ),
      ),
      body: postList != null
          ? ListView.builder(
              itemCount: postList.length,
              itemBuilder: (context, index) => postContainer(
                body: postList[index][ body ],
                title: postList[index][ title ],
                id: postList[index][ id ],
              ),
            )
          : const Center(
              child: CircularProgressIndicator(),
            ),
    );
  }
}





相关问题
Flutter App cannot be installed on Android TV

I m building a Flutter app that should support Android TV and Mobile devices. Despite Google Play shows that it is supported, I cannot install app on my MiBox device. While trying to install it, both ...

Moving the icon button to the right causes rendering issues

I am trying to align the icon button to the right of the Text field, I tried the row which made the icon button not centered vertically and now I am trying out the Stack widget. Here is my code - ...

热门标签