首页 > 解决方案 > Flutter - Pass values between routes using pushReplacementNamed

问题描述

I'm trying to pass values between routes using Navigator.pushReplacementNamed(), but I'm not getting it.

I can not figure out what the correct syntax and logic is in which data will exit pushReplacementNamed and get the routes key.

Can you help me?

Enter the code below to facilitate understanding:

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(),
      routes: <String, WidgetBuilder> {
        '/form': (BuildContext context) => new FormPage(email: ???, header: {'auth': ???}),
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new FloatingActionButton(
        onPressed: () {
          Navigator.pushReplacementNamed(context, '/form', {email: 'myemail@flutter.com', header: {'auth': '1234'}});
        },
        child: new Icon(Icons.navigate_next),
      ),
    );
  }
}

class FormPage extends StatefulWidget {
  FormPage({Key key, this.email, this.header}) : super(key: key);
  String email;
  Map header;
  @override
  FormPageState createState() => new FormPageState();
}

class FormPageState extends State<FormPage> {
  @override
  Widget build(BuildContext context) {
    return new Container(
      child: new Column(
        children: <Widget>[
          new Text(widget.email),
          new Text(widget.header['auth'])
        ],
      ),
    );
  }
}

After correction:

The purpose of trying to use pushReplacementNamed was to remove the route history, so if the user presses the device's back button to get back to the earlier route, the route would no longer exist. Reference

The reason for this implementation is to be used on a login page, if the user has already been authenticated by google sign he is redirected to the next page passing login parameters and could not return to the login page by device's back button.

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(),
      routes: <String, WidgetBuilder> {
        '/form': (BuildContext context) => new FormPage(), //new
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new FloatingActionButton(
        onPressed: () {
          Navigator.of(context).pushReplacement(                                                         //new
            new MaterialPageRoute(                                                                       //new
              settings: const RouteSettings(name: '/form'),                                              //new
              builder: (context) => new FormPage(email: 'myemail@flutter.com', header: {'auth': '1234'}) //new
            )                                                                                            //new
          );                                                                                             //new
        },
        child: new Icon(Icons.navigate_next),
      ),
    );
  }
}

class FormPage extends StatefulWidget {
  FormPage({Key key, this.email, this.header}) : super(key: key);
  String email;
  Map header;
  @override
  FormPageState createState() => new FormPageState();
}

class FormPageState extends State<FormPage> {
  @override
  Widget build(BuildContext context) {
    return new Container(
      child: new Column(
        children: <Widget>[
          new Text(widget.email),
          new Text(widget.header['auth'])
        ],
      ),
    );
  }
}

标签: dartflutter

解决方案


我认为您可能会错过了解结果的工作原理。结果返回到上一个推送最后一个路由的小部件,并await用于Future由上一次调用返回的结果push。你只是想用参数开始一条路线吗?然后你可以这样做。

Navigator.of(context).pushReplacement(
  new MaterialPageRoute(
    settings: const RouteSettings(name: '/form'),
    builder: (context) => new FormPage(
      email: 'myemail@flutter.com',
      header: {'auth': '1234'},
    ),
  ),
);

推荐阅读