如何在颤振中将多个参数从一个页面传递到另一个页面

Question

...
onTap: () {
 Navigator.push(
     context,
     MaterialPageRoute(
      builder: (context) => CategoryPage(
              snapshot.data[index]),
     ));
},
...

使用上面的代码，我尝试将服务 id 和服务类型传递给类别页面 ... class CategoryPage extends StatefulWidget { // final String serviceId; // 最终字符串 service_type; 最终字符串类别数据；

  CategoryPage(data, {key, this.categorydata}) : super(key: key);

  // @override
  // CategoryPage(categorydata) {
  //   this.serviceId = categorydata.serviceId;
  //   this.service_type = categorydata.serviceId;
  // }

  _CategoryPageState createState() =>
      _CategoryPageState(categorydata.toString());
 }

 class _CategoryPageState extends State<CategoryPage> {
  String id = "";
  _CategoryPageState(String categorydata) {
    this.id = categorydata.serviceId;
  }
...

从上面的代码中，我需要获取服务 id 和服务类型，并使用服务类型参数显示 Category 页面的 tile。 请帮助我实现这个结果

Answer 1

您必须使用CategoryPage构造函数中的categorydata参数传递这样的数据。

onTap: () {
 Navigator.push(
     context,
     MaterialPageRoute(
      builder: (context) => CategoryPage(
             categorydata: snapshot.data[index]),
     ));
},

在这里，您需要在StatefulWidget类中定义一个 final 变量，并从构造函数中对其进行初始化；

CategoryPage({key,required this.categorydata}) : super(key: key);

final Album categorydata;

_CategoryPageState createState() =>
    _CategoryPageState();
}

然后您可以使用widget关键字类从State类方法访问它，您不需要传递它。

 class _CategoryPageState extends State<CategoryPage> {


   @override
  void initState() {
    super.initState();
    // access them from here

   final categorydata = widget.categorydata;
   final String serviceId = categorydata.service_id;
   final String service_type = categorydata. service_type;

  }

  @override
  Widget build(BuildContext context) {
    // access them from here
    final categorydata = widget.categorydata;
    final String serviceId = categorydata.service_id;
    final String service_type = categorydata. service_type;
   }

  }

Answer 2

import 'package:flutter/material.dart';

class CategoryPage extends StatefulWidget {
  final String serviceId;
  final String service_type;
  final categorydata;
  CategoryPage(
      {Key? key,
      required this.serviceId,
      required this.service_type,
      required this.categorydata})
      : super(key: key);

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

class _CategoryPageState extends State<CategoryPage> {
  @override
  void initState() {
    print(widget.service_type);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: null,
    );
  }
}

你可以通过 widget.varname 直接访问这些变量

Answer 3

首先，如果您想在 Category Widget 中获取 2 个参数，您应该从上一页传递 2 个参数。 （而且我强烈推荐使用类。如果你想一起传递的项目是相互关联的，或者可以通过某些条件绑定，那么创建一个新类。你实例化这个类，你就可以传递并获取它。它更舒服并且可读使用。但也许以后。习惯它需要时间。）

...
onTap: () {
 Navigator.push(
     context,
     MaterialPageRoute(
      builder: (context) => CategoryPage(
              snapshot.date[index].id,
              snapshot.data[index].service_type),
              // snapshot.data[index] ----- replaced with two lines above),
     ));
},
...

并且您需要定义 serviceId 和 serviceType 变量来获取之前传递的参数。

class CategoryPage extends StatefulWidget {
  final String serviceId;
  final String serviceType;
   
  CategoryPage(this.serviceId, this.serviceType); 

然后你可以使用你的 serviceId 和 serviceType 像：

class _CategoryPageState extends State<CategoryPage> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text('ID: ${widget.serviceId}'), // widget. needs to be followed by serviceId
    );
  }
}

或者您可以定义一个新变量并将“serviceId”放入其中。

class _CategoryPageState extends State<CategoryPage> {
 var id = widget.serviceId;

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text('ID: ${id}'), // 
    );
  }
}