error loading data from API in FutureBuilder

Question

I have a problem when loading data from a FutureBuilder . I put a breakpoint and despite of my global list is coming full of data, the list is still not showing up and it keeps loading with the circular indicator. I do not understand because, in fact, snapshot HAS DATA:

class BookPageBody extends StatefulWidget {
  List<dynamic> breedlist;
  BookPageBody({Key? key, required this.breedlist}) : super(key: key);

  @override
  _BookPageBodyState createState() => _BookPageBodyState();
}

class _BookPageBodyState extends State<BookPageBody> {
  //pagecontroller hace que sea visible el anterior y el posterior slide en la pantalla
  Future<List<dynamic>> ? futureData;

  @override
  void initState() {
    super.initState();
    futureData = fetchData(AppConstants.APIBASE_URL);
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Column(children: [
        SizedBox(height: Dimensions.height20),
        Container(
            margin: EdgeInsets.only(left: Dimensions.width20),
            child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  BigText(text: 'Breed List'),
                ])),
        FutureBuilder(
          future: futureData,
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return ListView.builder(
                  itemBuilder: (BuildContext context, int index) {
                return ListCard(index: index, doglist: widget.breedlist);
              });
            } else if (snapshot.hasError) {
              return Text("${snapshot.error}");
            }
            return CircularProgressIndicator();
          },
        ),
      ]),
    );
  }
}

the method where I call my api and I fill my list:

List<dynamic> BreedList = [];

Future<List<dynamic>> fetchData(url) async {
  var client = http.Client();
  final response = await client.get(Uri.parse(url));
  await Future.delayed(Duration(seconds:2));
  if (response.statusCode == 200) {
    var jsonDecoded = json.decode(response.body);
    BreedList = jsonDecoded.map((data) => DogClass.fromJson(data)).toList();
    glossarList = BreedList;
    return BreedList;
  } else {
    throw Exception('Failed to load data');
  }
}

Rohan Jariwala · Accepted Answer · 2022-06-10 16:43:54Z

1

As I checked your code. I got to know that may be your global list is not updating data. Means you are getting data inside your global list but its not updating on all screens.

So, In my opinion try to use Provider of any Other state management library for this.

For Provider you can make Provider variable and use that inside the future builder.

answered Jun 10, 2022 at 16:43

Rohan Jariwala

2,1002 gold badges13 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

nvoigt · Accepted Answer · 2022-06-10 16:38:40Z

0

Your ListView.builder has no connection to your actual list. It will always be empty. You need to pass the list of data you get to this builder.

answered Jun 10, 2022 at 16:38

nvoigt

77.8k28 gold badges103 silver badges156 bronze badges

2 Comments

Lash Over a year ago

I do pass that list through parameter in another widget : widget.breedlist

nvoigt Over a year ago

But your listview builder will build zero items. It doesn't matter what an item looks like, if there is zero of them...

Collectives™ on Stack Overflow

error loading data from API in FutureBuilder

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related