Flutter go_router how to return result to previous page?

Question

I'm trying to open a page and get returned result with go_router package. In Navigation 1.0 I use this:

final result = await Navigator.push(
  context,
  MaterialPageRoute(builder: (context) => const SecondRoute()),
);
// handle result

But I can't seem to do it with go_router. Any solution or explaination?

Answer 1

The latest version of go_router package now supports this functionality. To pass data when popping from a screen, you can do this:

context.pop('value');

And to get this value back, your code should look like this:

String? val = await context.pushNamed('secondRoute');

Hope this helps, thank you

Answer 2

You can do this with GoRouter.of(context).addListener.

First you push your new page and add a listener afterwards

GoRouter.of(context).push("/page/${page!.id}/edit");
GoRouter.of(context).addListener(watchRouteChange);

The listener function can look something like this

  watchRouteChange() {
    if (!GoRouter.of(context).location.contains("/edit")) {  // Here you check for some changes in your route that indicate you are no longer on the page you have pushed before
      // do something
      GoRouter.of(context).removeListener(watchRouteChange); // remove listener
    }
  }

Answer 3

Presently there is no way to achieve this using go_router. You can use go_router_flow which is exactly like go_router with this pop with value feature.

final bool? result = await context.push<bool>('/page2');

WidgetsBinding.instance.addPostFrameCallback((_) {
  if(result){
    print('Page returned $result');
  }
});

Answer 4

You can use the callback by putting the function in extra object when push new screen.

Example Screen A -push-> Screen B ->pop with result -> Screen A (get results)

1. Define the function type to put

typedef AddNewEventResult = void Function(Result result);

2. Push A -> B

GoRoute(
path: kScreenB,
builder: (BuildContext context, GoRouterState state) => ScreenB(addNewEventResultstate.extra! as AddNewEventResult),
)

3. When screen B has done, just pop from B to A and attached the result (Result)

Navigator.of(context).pop();
widget.addNewEventResult(true, Result());

Answer 5

Unfortunately, the functionality you are looking for is not provided by GoRouter at this time.

An alternative to using go_router_flow is to implement something simple yourself by passing callbacks as the extra property on GoRouterState.

This dartpad contains a full example, but the gist is that you define your routes similar to:

GoRouter(
  initialLocation: "/",
  routes: <RouteBase>[
    GoRoute(
      path: "/second",
      builder: (_, state) {
        final params = state.extra! as SecondPageParams;

        return SecondPage(params: params);
      },
    ),
  ],
);

And define your SecondPage similar to:

class SecondPageParams {
  final void Function(String data) action;
  
  const SecondPageParams(this.action);
}

class SecondPage extends StatelessWidget {
  final SecondPageParams params;

  const SecondPage({super.key, required this.params});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: ElevatedButton(
            onPressed: () {
              context.pop();
              params.action("Data from second page");
            },
            child: const Text("Pop and perform action")
          ),
        ),
      ),
    );
  }
}

It's not as clean as being able to await a context.push, but this is a simple way you can specify the action that you want to take whenever SecondPage is popped off the stack without having to rely on a different package.

Answer 6

As of answer time, only support for doing

 List<Archive> selectArchives = await Navigator.of(context).push(
            MaterialPageRoute(
                builder: (context) => const ArchiveListPage(
                    selectMode: true, canSelectCount: 1)));

 context.pop(_selectArchives);

Answer 7

in the documentation : https://pub.dev/documentation/go_router/latest/topics/Navigation-topic.html

Waiting for a value to be returned:

onTap: () {
  final bool? result = await context.push<bool>('/page2');
  if(result ?? false)...
}

Returning a value:

onTap: () => context.pop(true)

Answer 8

This flow is described in the docs here: https://gorouter.dev/user-input

Generally you have to update the data and return some value back as a route with params and the screen itself should manage updates / data manipulation.

I don't want to copy paste their code here, but the answer you are looking for is in the docs page above.

Updated with link from archive: https://web.archive.org/web/20220325235726/https://gorouter.dev/user-input

Thanks ahmetakil

Answer 9

if you use Gorouter you can use

GoRouter.of(context).pop();

Answer 10

When you are done with the next screen just use Navigator.pop(context,true); and true is something that you want to send to the previous screen. You can send anything I'm just using true for reference. This will allow your result variable to get data and perform anything.