Lash
Lash

Reputation: 353

error loading data from API in FutureBuilder

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');
  }
}

Upvotes: 1

Views: 1028

Answers (2)

Rohan Jariwala
Rohan Jariwala

Reputation: 2048

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.

Upvotes: 1

nvoigt
nvoigt

Reputation: 77364

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.

Upvotes: 0

Related Questions