dart - Passing data through navigation in flutter?

Question

I want to pass a mobile number as well as a string data to check that whether the flow is from register or it is from login. So how can I do that? please provide me some help!

register.dart

class _RegisterPageState extends State<RegisterPage> {
  String execute_from = 'Register';
UserData _data = UserData();
   submit() async {
    if (this._formKey.currentState.validate()) {
      _formKey.currentState.save();
   print(_data.mobileNo);
 // Navigator.pushNamed(context, '/otp', arguments: '${_data.mobileNo}'); /* here I want to pass 
    execute_from */
  }
}

route.dart

class RouteGenerator {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/':
        return MaterialPageRoute(builder: (_) => SplashScreenPage());
      case '/register':
        return MaterialPageRoute(builder: (_) => RegisterPage());
      case '/login':
        return MaterialPageRoute(builder: (_) => LoginPage());
      case '/otp':
        var mobNumber = settings.arguments as String;   /* Is this right way to pass? */
        var execute_from = settings.arguments as String;
        return MaterialPageRoute(builder: (_) => OtpPage(mobNumber, execute_from));
      case '/home':
        return MaterialPageRoute(builder: (_) => HomePage());
      default:
        return MaterialPageRoute(
            builder: (_) => Scaffold(
                  body: Center(
                      child: Text('No route defined for ${settings.name}')),
                ));
    }
  }
}

otp.dart

class OtpPage extends StatefulWidget {
  final String mobNumber;
  final String execute_from;
  String formattedMobNo;

  OtpPage(this.mobNumber, this.execute_from) {
    formattedMobNo = this.mobNumber.replaceRange(2, 8, 'XXXXXX');
    print(execute_from);

  }
 //........
}

Please tell me how can I receive those on my otp page.

question from:https://stackoverflow.com/questions/65845439/passing-data-through-navigation-in-flutter

Answer 1

First, you need to pass arguments as array like below,

Navigator.pushNamed(context, '/otp', arguments: [
  _data.mobileNo.toString(),
  execute_from.toString()
]);

and then in your RouteGenerator class convert the receiving format to List like this

var mobNumber = settings.arguments as List;

and then simply print and check your value

print("==========>>mobile_number${mobNumber[0].toString()}");
print("==========>>mobile_number${mobNumber[1].toString()}");

and here you navigate to OtpPage like this

MaterialPageRoute(builder: (_) => OtpPage(mobNumber: mobNumber[0].toString(), execute_from: mobNumber[1].toString()));

And your OTP page should be like this

class OtpPage extends StatefulWidget {
  var mobNumber;
  var execute_from;

  OtpPage({this.mobNumber, this.execute_from});

  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _selectionScreen();
  }
}

class _selectionScreen extends State<OtpPage> {

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print("===================>>${widget.mobNumber}");
    print("===================>>${widget.execute_from}");
  }
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold();
  }
}

I hope this will help for you