How to handle back button of browser in Flutter Web

Question

this question had already asked in this link How to configure go back button in Browser for Flutter Web App and I implement onWillPop, so when user is in A screen and then click the button See Detail I will navigate them to B screen and then.. when user is in B screen and click the back button of browser I will navigate them back to A screen... the first trial is success but when I do it second time I got an error like this

Error: Assertion failed: org-dartlang-sdk:///flutter_web_sdk/lib/_engine/engine/navigation/history.dart:288:14
_userProvidedRouteName != null
is not true

in my first screen (A Screen), I have a button like this:

FlatButton(
                                        onPressed: () {
                                          Navigator.pushReplacement(
                                              context,
                                              MaterialPageRoute(
                                                  builder: (BuildContext ctx) =>
                                                      Detail(
                                                          value:x[i])));
                                        },
                                        child: Text("See Detail"),
                                        textColor: Colors.white,
                                        color: Colors.blueAccent,
                                      )

and for the Detail Screen (B Screen) I use onWillPop like this

WillPopScope(
      onWillPop: () {
        Navigator.pushReplacement(context,
            MaterialPageRoute(builder: (BuildContext ctx) => FirstScreen()));
        return Future.value(true);
      },
      child: Scaffold(
          key: _globalKey,
....

is there something that I should add more?

no, First Screen here is screen before I click the button...( screen that consist of button See Detail above) — wahyu, Dec 28 '20 at 02:47
@Mary Hi.. sorry for my late response, I can't fix it so I use another method — wahyu, Dec 13 '21 at 02:36

ASAD HAMEED · Answer 1 · 2020-12-28T05:20:02.727

Call Navigator.pop(context); inside the onWillPop of screen B.

Make sure when you navigate from Screen A to Screen B, you should not use Navigator.pushReplacement as it removes ScreenA from the screen stack(not sure if this is the right term)

Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => ScreenB()),
  );

Here is an example by flutter.

https://flutter.dev/docs/cookbook/navigation/navigation-basics

How to handle back button of browser in Flutter Web

1 Answers1