单击GridView项时将数据传递到其他屏幕

我是一个学习颤动的Java开发人员。单击GridView的某个项时,我需要将数据传递到另一个屏幕。我尝试了一些在线帮助,但找不到更好的解决方案,

我的班级是,

class Product extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _ProductState();
  }
}

var productList = [
  {
    "name": "Product 1",
    "image": "assets/products/product1.jpg",
    "price": 6.99,
    "description": "30% off",
  },
  .
  .
  .
  .
];

class _ProductState extends State<Product> {
  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      physics: const NeverScrollableScrollPhysics(),
      shrinkWrap: true,
      itemCount: productList.length,
      gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
      ),
      itemBuilder: (BuildContext context, int index) {
        return FeatureProduct(
          productName: productList[index]['name'],
          productImage: productList[index]['image'],
          productPrice: productList[index]['price'],
          productDescription: productList[index]['description'],
        );
      },
    );
  }
}

class FeatureProduct extends StatelessWidget {
  final String productImage;
  final String productName;
  final String productDescription;
  final double productPrice;

  FeatureProduct(
      {this.productImage,
      this.productName,
      this.productPrice,
      this.productDescription});

  @override
  Widget build(BuildContext context) {
    return Card(
      child: Hero(
        tag: productName,
        child: Material(
          child: InkWell(
            onTap: () {
              // print(productName);
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => new ProductDetail(
                        product: FeatureProduct(
                          productName: productName,
                          productImage: productImage,
                          productDescription: productDescription,
                          productPrice: productPrice,
                        ),
                      ),
                ),
              );
            },
            child: GridTile(
                footer: Container(
                  color: Colors.white70,
                  child: ListTile(
                    leading: Text(
                      productName,
                      style: TextStyle(
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    title: Text(
                      "RM $productPrice",
                      style: TextStyle(
                        color: Colors.red,
                        fontWeight: FontWeight.w700,
                      ),
                    ),
                    subtitle: Text(
                      productDescription,
                      style: TextStyle(
                        color: Colors.black,
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ),
                ),
                child: Padding(
                  padding: EdgeInsets.all(15.0),
                  child: Image.asset(
                    productImage,
                    fit: BoxFit.cover,
                  ),
                )),
          ),
        ),
      ),
    );
  }
}

class ProductDetail extends StatelessWidget {
  final FeatureProduct product;

  ProductDetail({this.product});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("${product.productName}"),
      ),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: Text('${product.productDescription}'),
      ),
    );
  }
}

我尝试过,但在执行上述代码的过程中遇到了以下异常,

i/flutter(7767):调度程序库捕获的异常 ╞═════════════════════════════════════════════════════════ i/flutter(7767):在调度程序回调期间引发了以下断言: i/flutter(7767):子树中有多个英雄共享同一个标签。 i/flutter(7767):在每个要为其设置动画的英雄子树(通常是pageroute子树)中,每个英雄 i/flutter(7767):必须具有唯一的非空标记。 i/flutter(7767):在这种情况下,多个英雄有以下标签:产品5 I/Flutter(7767):这是一个冒犯英雄的子树: I/Flutter(7767):Hero(标签:产品5,状态:HeroState C56BF) I/Flutter(7767):键子树-[globalkey ef976] I/Flutter(7767):材料(类型:帆布,状态:材料状态d2e02) I/Flutter(7767):动画物理模型(持续时间:200毫秒,形状:矩形,边界半径:边界半径。零,高度:0.0, 颜色:颜色(0xfffafafa),动画颜色:假,阴影颜色: 颜色(0xff000000),动画阴影颜色:真,状态: _动画物理模型状态8cf00(断续器不活动)

我怎么解决这个问题,请帮帮我。