Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – How to call async function in futter FutureBuilder widget?

Here is my code

return FutureBuilder(
        future: dbHelper.abonnements(),
        builder: (context,snapshot){
          if(snapshot.data==null){
            return StartUpScreen();
          }else{
            final meterId = snapshot.data![0].meterId;
            final clientId = snapshot.data![0].clientId;
            final abonnement = snapshot.data![0];

            final compteur = await MeterAPIManager.getMeter(meterId);
            final user = await ClientAPIManager.getUser(clientId);

            return HomeScreen(abonnement: abonnement,compteur: compteur,user: user);
          }
        }
    );

Retriving varables compteur and user gives me errors. I cannot add async to my builder.
How can I solve this problem ?

Tags:

2

Answers


  1. 0

    You can use a combination of async and await within a function to perform asynchronous operations before returning the widget tree. However, you need to ensure that the function containing the asynchronous operations returns a widget.

      return FutureBuilder(
  future: dbHelper.abonnements(),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return CircularProgressIndicator(); // or any loading indicator
    } else if (snapshot.hasError) {
      return Text('Error: ${snapshot.error}');
    } else if (snapshot.data == null || snapshot.data!.isEmpty) {
      return StartUpScreen();
    } else {
      return _buildHomeScreen(context, snapshot.data!);
    }
  },
);

// Define a separate function to handle the asynchronous operations and return the widget tree
Widget _buildHomeScreen(BuildContext context, List<Abonnement> abonnements) {
  final meterId = abonnements[0].meterId;
  final clientId = abonnements[0].clientId;
  Abonnement abonnement;
  Meter? compteur;
  User? user;

  return FutureBuilder(
    future: _fetchData(meterId, clientId),
    builder: (context, snapshot) {
      if (snapshot.connectionState == ConnectionState.waiting) {
        return CircularProgressIndicator(); // or any loading indicator
      } else if (snapshot.hasError) {
        return Text('Error: ${snapshot.error}');
      } else {
        return HomeScreen(abonnement: abonnement!, compteur: compteur!, user: user!);
      }
    },
  );
}

// Function to perform asynchronous operations
Future<void> _fetchData(String meterId, String clientId) async {
  compteur = await MeterAPIManager.getMeter(meterId);
  user = await ClientAPIManager.getUser(clientId);
}
    Login or Signup to reply.
  2. 0

    you could do all work in function:

      Future<Abonement?> getAbonement() async {
    final abonnements = await dbHelper.abonnements();
    final abonnement = abonnements[0];
    if (abonnement == null) return null;
    
    final meterId = abonnement.meterId;
    final clientId = abonnement.clientId;
    
    final compteur = await MeterAPIManager.getMeter(meterId);
    final user = await ClientAPIManager.getUser(clientId);
    return compteur== null || user == null? null : Abonement(compteur, user);
  }

    where:

    class Abonement {
  const Abonement(this.compteur, this.user);

  final Compteur compteur;
  final User user;
}

    and then

    return FutureBuilder(
        future: getAbonement(),
        builder: (context,snapshot){ ...
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search