【问题标题】:How to pass specific ListTile variables to new page route onTap?如何将特定的 ListTile 变量传递给新的页面路由 onTap?
【发布时间】:2019-06-30 09:56:54
【问题描述】:

我的代码构建了一个 ListTiles 的 ListView,每个 ListTile 从云 Firestore 数据库中获取数据。

当我激活 ListTile 的 onTap 时,我想路由到新页面并将该图块的特定数据传递到新页面。

我在其上构建列表视图的页面已将变量传递给没有问题,但是我无法在此页面上使用相同的方法。

我对扑扑和飞镖还很陌生。我的第一个假设是它可能需要一个有状态的小部件来完成这个?但是我不确定如何实现这一点。

import 'package:flutter/material.dart';

import 'package:menu/screens/menu/detail.dart';

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_storage/firebase_storage.dart';

class Menu extends StatelessWidget {
    final String barcode;

  // receive data from the FirstScreen as a parameter
  Menu({Key key, @required this.barcode}) : super(key: key);

  Widget _buildListItem(BuildContext context, DocumentSnapshot document) {
    return ListTile(
      leading: Icon(Icons.fastfood),
      title: Text(document['item'] ?? '*name*'),
      subtitle: Text( document['description'] ?? '*description*'),
      isThreeLine: true,
      onTap: (){
        Navigator.push(
            context,
            MaterialPageRoute(
            builder: (context) => Detail(),
        ),);
        },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Menu'),
      ),
      body: StreamBuilder(
          stream: Firestore.instance.collection(barcode).snapshots(),
          builder: (context, snapshot) {
            if (!snapshot.hasData) return const Text('loading...');
            return ListView.builder(
              itemExtent: 80.0,
              itemCount: snapshot.data.documents.length,
              itemBuilder: (context, index) =>
                  _buildListItem(context, snapshot.data.documents[index]),
            );
          }),
    );
  }
}

【问题讨论】:

    标签: firebase dart flutter google-cloud-firestore


    【解决方案1】:

    将document 作为参数传递给Detail

        Navigator.push(
            context,
            MaterialPageRoute(
            builder: (context) => Detail(document), // <-- document instance
        ),);
    

    Detail小部件当然需要以document为参数:

    class Detail extends ... {
      Detail(this.document);
      final DocumentSnapshot document;
    }
    

    如https://flutter.io/docs/cookbook/navigation/passing-data中所述

    【讨论】:

    • 我之前尝试过,但它抛出错误:'位置参数太多:预期为 0,但找到了一个'
    • 你需要在Detail小部件中添加document作为参数,或者如果使用命名参数,那么Detail(document: document)
    猜你喜欢
    • 2021-08-18
    • 2015-03-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-14
    • 2012-01-31
    • 1970-01-01
    • 2019-08-04
    相关资源
    最近更新 更多