Home > Software engineering >  pointless Api requests occuring in future builder flutter
pointless Api requests occuring in future builder flutter

Time:10-22

I have a Future Builder in my flutter app and it displays --

  1. Error : if there's an error in json parsing
  2. Data : if everything goes smooth
  3. Loader : if its taking time

Everything works. the Future is calling a 'future' function thats doing a get request of some student data and the 'builder' is displaying it. I have an edit dialog box on the same page. I can edit the student information through the put request. The problem is that when I click on the form fields in the edit dialog box, I notice that get request is automatically happening approx 10 times. When I save the edits, a confirmation dialog box appears that data is updated. While this happens again get requests happens upto 10 times. And then it pops. So there are round about 20 useless requests happening on the server. I think it happens because when I click the form fields the keyboard appears and the underlying displaying widget rebuilds, calling the api. When data is edited keyboards goes back into its place again widget rebuilds, calling the api. How can I resolve this issue ?

this is the code if it helps :

 child: FutureBuilder(
            future: APIs().getStudentDetails(),
            builder: (context, data) {
              if (data.hasError) {
                return Padding(
                    padding: const EdgeInsets.all(8),
                    child: Center(child: Text("${data.error}")));
              } else if (data.hasData) {
                var studentData = data.data as List<StudentDetails>;
                return Padding(
                  padding: const EdgeInsets.fromLTRB(0, 15, 0, 0),
                  child: SingleChildScrollView(
                    child: SizedBox(
                      height: MediaQuery.of(context).size.height * 0.9,
                      child: ListView.builder(
                        itemCount: studentData.length,
                        itemBuilder: ((context, index) {
                          final student = studentData[index];
                          final id = student.studentId;
                          final father = student.fatherName;
                          final mother = student.motherName;
                          final cg = student.cg;
                          final cityName = student.city;
                          final studentName = student.studentName;
                          return SizedBox(
                            child: Padding(
                              padding: const EdgeInsets.all(30.0),
                              child: SingleChildScrollView(
                                child: GestureDetector(
                                  onDoubleTap: () {
                                    edit(context, id!, studentName!, father,
                                        mother, cg, cityName!);
                                  },
                                  child: Column(children: [
                                    CustomReadOnlyField(
                                        hintText: id.toString()),
                                    CustomReadOnlyField(hintText: studentName),
                                    CustomReadOnlyField(hintText: father),
                                    CustomReadOnlyField(hintText: mother),
                                    CustomReadOnlyField(
                                        hintText: cg.toString()),
                                    CustomReadOnlyField(hintText: cityName),
                                  ]),
                                ),
                              ),
                            ),
                          );
                        }),
                        scrollDirection: Axis.vertical,
                      ),
                    ),
                  ),
                );
              } else {
                return const Center(child: CircularProgressIndicator());
              }
            },
          ),

CodePudding user response:

Create a state variable for future like

late final future = APIs().getStudentDetails();

and use

FutureBuilder(
   future: future ,

You can check Fixing a common FutureBuilder and StreamBuilder problem

CodePudding user response:

I followed this answer and it worke. Flutter FutureBuilder gets constantly called Apparantly I had to 'Lazily initializing my Future' and 'Initializing my Future in initState:'

CodePudding user response:

class _YourWidgetState extends State<YourWidget> with AutomaticKeepAliveClientMixin<YourWidget> {
 @override
  bool get wantKeepAlive => true;

So extend your Widget with AutomaticKeepAliveClientMixin so items inside Listview will not be reproduced

  • Related