skip to Main Content

before I upgraded my flutter version everything went smoothly there was no warning. but after I updated flutter suddenly there was a warning Don’t use ‘BuildContext’s across async gaps.
Try rewriting the code to not reference the ‘BuildContext’.

Here is the problem

ProfileMenuItem(
              iconUrl: 'assets/ic_edit_profile.png',
              title: 'Edit Profile',
              onTap: () async {
                if (await Navigator.pushNamed(context, '/pin') == true) {
                 if(context.mounted) Navigator.pushNamed(context, '/profile-edit');
                }
              },
            ),

And heres my full code

import 'package:bank_sha/shared/theme.dart';
import 'package:bank_sha/ui/widgets/buttons.dart';
import 'package:bank_sha/ui/widgets/profile_menu_item.dart';
import 'package:flutter/material.dart';

class ProfilePage extends StatelessWidget {
  const ProfilePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('My Profile'),
      ),
      body: ListView(
        padding: const EdgeInsets.symmetric(
          horizontal: 24,
        ),
        children: [
          const SizedBox(
            height: 20,
          ),
          Container(
            padding: const EdgeInsets.symmetric(
              horizontal: 30,
              vertical: 22,
            ),
            decoration: BoxDecoration(
              color: whiteColor,
              borderRadius: BorderRadius.circular(20),
            ),
            child: Column(
              children: [
                Container(
                  height: 120,
                  width: 120,
                  decoration: const BoxDecoration(
                    shape: BoxShape.circle,
                    image: DecorationImage(
                      image: AssetImage('assets/img_profile.png'),
                    ),
                  ),
                  child: Align(
                    alignment: Alignment.topRight,
                    child: Container(
                      width: 28,
                      height: 28,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        color: whiteColor,
                      ),
                      child: Center(
                        child: Icon(
                          Icons.check_circle,
                          color: greenColor,
                          size: 24,
                        ),
                      ),
                    ),
                  ),
                ),
                const SizedBox(
                  height: 16,
                ),
                Text(
                  'Mr Geblekx',
                  style: blackTextStyle.copyWith(
                    fontSize: 18,
                    fontWeight: medium,
                  ),
                ),
                const SizedBox(
                  height: 40,
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_edit_profile.png',
                  title: 'Edit Profile',
                  onTap: () async {
                    if (await Navigator.pushNamed(context, '/pin') == true) {
                     if(context.mounted) Navigator.pushNamed(context, '/profile-edit');
                    }
                  },
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_pin.png',
                  title: 'My Pin',
                 onTap: () async {
                    if (await Navigator.pushNamed(context, '/pin') == true) {
                     if(context.mounted) Navigator.pushNamed(context, '/profile-edit-pin');
                    }
                  },
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_wallet.png',
                  title: 'Wallet Settings',
                  onTap: () {},
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_reward.png',
                  title: 'My Rewards',
                  onTap: () {},
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_help.png',
                  title: 'Help Center',
                  onTap: () {},
                ),
                ProfileMenuItem(
                  iconUrl: 'assets/ic_logout.png',
                  title: 'Log Out',
                  onTap: () {},
                ),
              ],
            ),
          ),
          const SizedBox(
            height: 87,
          ),
          CustomTextButton(
            title: 'Report a Problem',
            onPressed: () {},
          ),
          const SizedBox(
            height: 50,
          ),
        ],
      ),
    );
  }
}

im try to add context.mounted on await but it doesn’t work
can anyone help me
thanks

2

Answers


  1. Convert ProfilePage into a StatefulWidget and use if(mounted) to check whether the widget is still mounted.

    Login or Signup to reply.
  2. Try it this way:

    onTap: () async {
      // Declare navigator instance (or other context using methods/classes)
      // before async method is called to use it later in code
      final navigator = Navigator.of(context);
    
      // Now use the navigator without the warning
      if (await navigator.pushNamed('/pin') == true) {
        navigator.pushNamed('/profile-edit');
      }
    },
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search