如何在颤振的命名路由中传递多个参数

Rav*_*lon 12 routes flutter

我正在尝试将多个参数传递给命名路由。我尝试了多种方法,但到目前为止还没有成功。谁能告诉我如何实现这一目标?

路线.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:brandcare/views/pdf_view.dart';
import 'package:brandcare/views/reports_view.dart';

class RouteGenerator {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    final args = settings.arguments;
    switch (settings.name) {
      case 'reports':
        return CupertinoPageRoute(builder: (BuildContext context) => ReportsView());
      case 'pdf':
        return CupertinoPageRoute(builder: (BuildContext context) => PDFView());
      default:
        return CupertinoPageRoute(builder: (BuildContext context) => DashboardView());
    }
  }
}

Run Code Online (Sandbox Code Playgroud)

列表项上的 Ontap 事件 reports_view.dart

onTap: () {
  Navigator.pushNamed(
    context, 'pdf',
    arguments: PDFView(
      reportTitle: 'January Report',
      reportFullPath: 'https://static.example.com/reports/123456.pdf'
    )
  );
},
Run Code Online (Sandbox Code Playgroud)

我想访问多个参数的页面

pdf_view.dart

class PDFView extends StatefulWidget {
  final String reportTitle;
  final String reportFullPath;

  PDFView({
    Key key,
    this.reportTitle,
    this.reportFullPath,
  }) : super(key: key);

  @override
  _PDFViewState createState() => _PDFViewState();
}

class _PDFViewState extends State<PDFView> {
  String title = this.widget.reporTitle;
  String url = this.widget.reportFullPath;
}
Run Code Online (Sandbox Code Playgroud)

har*_*era 17

你传递了错误的论点。您需要传递您想要的特定参数对象。对于您的情况,您需要创建一个这样的:

class ScreenArguments {
  final String reportTitle;
  final String reportFullPath;

  ScreenArguments(this.reportTitle, this.reportFullPath);
}
Run Code Online (Sandbox Code Playgroud)

现在在推送这样的路由时将此对象作为参数传递:

Navigator.pushNamed(
      context,
      'pdf',
      arguments: ScreenArguments(
        'January Report',
         'https://static.example.com/reports/123456.pdf',
      ),
    );
Run Code Online (Sandbox Code Playgroud)

现在您需要访问传递给路由生成器中的路由的参数。像这样:

class RouteGenerator {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    final args = settings.arguments;
    switch (settings.name) {
      case 'reports':
        return CupertinoPageRoute(builder: (BuildContext context) => ReportsView());
      case 'pdf':
        return CupertinoPageRoute(builder: (BuildContext context) {
          ScreenArguments argument = args;
          return PDFView(
            reportTitle: argument.reportTitle,
            reportFullPath: argument.reportFullPath,
          );
        });
      default:
        return CupertinoPageRoute(builder: (BuildContext context) => DashboardView());
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

这将解决您的问题

  • 这是在命名路由中传递多个参数的最佳方法,谢谢 (2认同)

小智 14

我通过传入这样的不同参数列表来实现它:

Navigator.of(context).pushNamed("/someRoute", arguments:[8, "a string"]);
Run Code Online (Sandbox Code Playgroud)

然后在路由生成器中,我像这样转发它们:

// ...    
case "/someRoute":
  List<dynamic> args = settings.arguments;;
  return MaterialPageRoute(builder: (_) => SomeScreen(someInt: args[0], someString: args[1])); 
Run Code Online (Sandbox Code Playgroud)


Ani*_*ora 7

您可以在目标小部件屏幕中创建参数类,并将其对象作为来自源类的参数传递。

例子:

// above will be the code for your target screen/widget as usual below will be the respected argument class for the same target screen/widget

    class WeatherRouteArguments {
      WeatherRouteArguments({ required this.city, required this.country });
      final String city;
      final String country;
    
      bool get isGermanCapital {
        return country == 'Germany' && city == 'Berlin';
      }
    }
Run Code Online (Sandbox Code Playgroud)

使用参数调用屏幕,您可以执行以下操作:

void _showWeather() {
  Navigator.pushNamed(
    context,
    '/weather',
    arguments: WeatherRouteArguments(city: 'Berlin', country: 'Germany'),
  );
}
Run Code Online (Sandbox Code Playgroud)

我想您知道如何在目标小部件类的构建中获取参数,可以按如下方式完成:

 final args = ModalRoute.of(context)!.settings.arguments as WeatherRouteArguments;
Run Code Online (Sandbox Code Playgroud)

参考: https: //api.flutter.dev/flutter/widgets/Navigator/pushNamed.html