Flutter Navigation from Firestore Flag

Question

Diagram of what I want to do] 1

I want to navigate to Screen2 from screen1 when the value of screen2_flag changes to true (on firebase cloud firestore ),

I have screen 1 as shown in the diagram,which is working perfectly fine until the value of screen2_flag is false, when I change the value of flag from false to true.

  void initState() {
    super.initState();

    DocumentReference reference =
        Firestore.instance.collection('myColection').document('myDoc');
    reference.snapshots().listen((querySnapshot) {
      print('got sanpshot' + querySnapshot.data['screen2_flag'].toString());
      if (querySnapshot.data['screen2_flag'].toString() == 'true') {
        Navigator.pushNamed(context, screen2.id);
      }
    });


   Widget build(BuildContext context) {
      // my code 
    ...

   }


  }

I am able to see screen2 on my emulator. But Getting below error on Console

[ERROR:flutter/lib/ui/ui_dart_state.cc(157)] Unhandled Exception: setState() callback argument returned a Future. E/flutter (24551): The setState() method on _WaitingRoomState#25dfa was called with a closure or method that returned a Future. Maybe it is marked as "async". E/flutter (24551): Instead of performing asynchronous work inside a call to setState(), first execute the work (without updating the widget state), and then synchronously update the state inside a call to setState(). E/flutter (24551): #0 State.setState. (package:flutter/src/widgets/framework.dart:1151:9) E/flutter (24551): #1 State.setState (package:flutter/src/widgets/framework.dart:1167:6)

Answer 1

The error told you the problem:

setState() callback argument returned a Future

The setState() method on _WaitingRoomState#25dfa was called with a closure or method that returned a Future

and told you also the solution:

Instead of performing asynchronous work inside a call to setState(), first execute the work (without updating the widget state), and then synchronously update the state inside a call to setState()

So you do the async call,await for it until you get the flag value(as I suppose because you didn't show that part of code), then call setState() with the new values updated.