Flutter学习第4章 父页面向子页面传值

1、代码

import 'package:flutter/material.dart';
//有一个商品对象
class Product{
  final String title;//商品标题
  final String description;//商品描述
    
//创建商品对象的时候需要传递两个参数进来，标题和描述
  Product(this.title,this.description);//构造函数
}

void main(){
  runApp(MaterialApp(
    title:'导航数据传递和接收',
    //首页就是商品列表，自动生成二十条数据，放到Pruduct类中
    home: ProductLIst(
      products:List.generate(20, (i) =>Product('商品$i','这是一个商品详情，编号为:$i'))
    ),
  ));
}
//商品列表实例化
class ProductLIst extends StatelessWidget {
  //接收商品列表20条数据
  final List<Product> products;
//固定写法
  ProductLIst({Key key,@required this.products}):super(key:key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('商品列表'),),
      body: ListView.builder(
        itemCount: products.length,
        itemBuilder: (context,index){
          return ListTile(
            title:Text(products[index].title),
            //监听listTile点击事件
            onTap: (){
            //跳转到详情页，并携带一个唯一标识，把当前点击的商品对象传过去
              Navigator.push(context, MaterialPageRoute(
                    builder: (context) => new ProductDetial(product:products[index])
              ));
            },
          );
        }
      ),
    );
  }
}

class ProductDetial extends StatelessWidget {
//接收父页面传来的值
  final Product product;
  ProductDetial({Key key,@required this.product}):super(key:key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('$product.title'),),
      body: Center(
        child: Text('${product.description}'),
      ),
    );
  }
}

2、作用范围

一般用于处理商品到商品详情之间传递唯一的商品id