futter页面跳转,列表跳转至详情页介绍

浏览478

1、使用InkWell()包裹元素,onTap(){}点击跳转

onTap: (){
  Navigator.of(context).push(
     MaterialPageRoute(builder: (context)=>DetailPage(
     eachVodId: val['id'],
     eachVodName: val['vod_name'],
     p:1
     ))
);
}

1.1、demo代码:

      return InkWell(
        onTap: (){
          Navigator.of(context).push(
              MaterialPageRoute(builder: (context)=>DetailPage(
                  eachVodId: val['id'],
                  eachVodName: val['vod_name'],
                  p:1
              ))
          );
        },
      );

2、引入详情页面,不然报错

import 'detail_page.dart';

3、详情页接受数据:

3.1、接受数据:

DetailPage({Key key, @required this.eachVodId, @required this.eachVodName, @required this.p, @required this.url}) : super(key: key);

定义变量:

  final int eachVodId;
  final String eachVodName;
  final int p;

3.2,、获取数据:

widget.eachVodId;

3.3、demo代码:

import 'package:flutter/material.dart';
class DetailPage extends StatefulWidget{
  DetailPage({Key key, @required this.eachVodId, @required this.eachVodName, @required this.p, @required this.url}) : super(key: key);
  final int eachVodId;
  final String eachVodName;
  final int p;
  _DetailState createState() => _DetailState();
}
class _DetailState extends State<DetailPage> {
  @override
  void initState() {
    super.initState();
    var map = Map();
    map["id"] = widget.eachVodId;
    map["p"] = widget.p;
}
Widget build(BuildContext context) {}
}



  • 暂无任何回答