BuildContext in async method in flutter get warning: "Don't use 'BuildContext's across async gaps"

Question

I have an API call inside my flutter application. After that API returned, I need to navigate to other screen, but a warning is shown:

Don't use 'BuildContext's across async gaps. Try rewriting the code to not use the 'BuildContext', or guard the use with a 'mounted' check.

How can I do this?

This is the API call code:

               apiService.checkOTP(_emailController.text, s).then((profile) async {
                  if (profile != null) {
                    SharedPreferences sp = await SharedPreferences.getInstance();
                    ......
                    Navigator.push(context,
                                      MaterialPageRoute(builder: (context) => MyHomePage(title: GlobalConstants.appName)));
                    // Store the profile data or navigate to the next screen
                    // For example, you can save the profile in shared preferences or a state management solution
                    return null; // Indicating that the OTP is valid
                    
                  }
                }).catchError((error) {
                  showMessage(state, ContentType.failure, '¡Error!', 'error message.');
                });

This question is similar to: Do not use BuildContexts across async gaps. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. — Munsif Ali
– Munsif Ali, Commented Jul 28 at 4:12

Randal Schwartz · Accepted Answer · 2025-07-27 21:41:06Z

2

It means pretty much what it says. You have "await.... context", and that pattern can blow up if the widget gets unmounted during the await. The docs actually have examples of bad and good code: https://dart.dev/tools/linter-rules/use_build_context_synchronously

answered Jul 27 at 21:41

Randal Schwartz

44.8k4 gold badges51 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Munsif Ali · Accepted Answer · 2025-07-28 05:26:30Z

0

Convert the then chain to async-await for better readability and context safety.
Add a StatefulWidget and use if (!mounted) return; before using context.

Example:

final profile = await apiService.checkOTP(_emailController.text, s);
if (profile != null) {
  if (!mounted) return;
  Navigator.push(context, MaterialPageRoute(...));
}

edited Jul 28 at 5:26

Munsif Ali

7,8477 gold badges33 silver badges65 bronze badges

answered Jul 28 at 5:13

Himanshu Lahoti

13 bronze badges

Comments

Kalantos · Accepted Answer · 2025-07-29 15:03:16Z

BuildContext is your key to add widgets to the tree and to perform actions like navigation.
Since you are calling it inside a async function that key maybe no longer valid.

For example, if you call it from a widget and that widget was removed from the tree, the associated context is also removed.*

To avoid that you need to check if the context is still valid. Flutter provide a simple thing to do this (inside stateful clases)

  if (mounted){
//PERFORM YOUR ACTION
}

or even better just stop any further action if context is invalid

  if (!mounted) return;

With this you can check before doing your action and ensure is always a valid context

Collectives™ on Stack Overflow

BuildContext in async method in flutter get warning: "Don't use 'BuildContext's across async gaps"

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related