snapshot.ConnectionState always waiting

Question

In a FutureBuilder, snapshot.ConnectionState is always waiting, but the future function completed successfully. While in a different page the same block of code works and the ConnectionState transitions from waiting to done.

The future function:

Future getDoctors() async {
    var res = await http.get(globals.domain + "users/docs/");
    var resBody = json.decode(utf8.decode(res.bodyBytes));

    print(res.statusCode);

    if (res.statusCode == 200) {
      if (mounted) {
        setState(() {
          doctors = resBody;
        });
      }
    }
  }

The future builder:

FutureBuilder(
    future: getDoctors(),
    builder: (BuildContext context, snapshot) {
        print(snapshot);
    }
)

Actual result: AsyncSnapshot<dynamic>(ConnectionState.waiting, null, null) Expected result: transiton to AsyncSnapshot<dynamic>(ConnectionState.done, null, null)

EDIT1: while debugging noticed that the future function getDoctors() is called periodically, I guess that's why the snapshot is always waiting

Answer 1

Calling setState causes the widget tree to be rebuild. Therefore, when the FutureBuilder is rebuilt, the getDoctors() function is invoked again, causing an infinite loop (getDoctors()->setState()->rebuild->getDoctors()...)

The solution is to either remove setState from the getDoctors method or invoke getDoctors() once in the initState() method, store the Future and pass it to the FutureBuilder, thus ensuring that it is only done once.

Future _doctorsFuture;

initState() {
    ...
    _doctorsFuture = getDoctors();
}

.
.

// Somewhere in build()
    FutureBuilder(
        future: doctorsFuture,
        builder: (BuildContext context, snapshot) {
            print(snapshot);
        }
    ),