Passing specific document (Object: Document Snapshot) to Details Page

[Andrew Villegas]

Hi flutter community,

I'm trying to pass a Document Snapshot to another view so I can display all its properties. I can declare and initialize the constructor for this Document Snapshot in the Details Page. However, when trying to pass this Document Snapshot, I get Undefined name 'snapshot'.

Here's how I'm 'receiving' my data inside the DetailsPage

final DocumentSnapshot productId;
ProductsDetailsPage({this.productId});

This is what I'm trying in the ProductsContainer and the error I'm getting:

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
navigateToDetailsPage(snapshot.data[index]);
},
child: Container(
child: FutureBuilder<QuerySnapshot>(
future: widget.value.get(),
builder: (context, snapshot) {...

And the method "navigateToDetailsPage"

class _ProductContainerState extends State<ProductContainer> {
navigateToDetailsPage(DocumentSnapshot productId) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ProductsDetailsPage(
productId: productId,
),...

----------------------------------------

I guess the core of my question is, isn't the navigateToDetailsPage(snapshot.data[index]);

The same one I'm using to fetch and read all my data in my build method?

// ex:

return Listview(

children: snapshot.data.docs.map((document) {
return Container(

Thanks community! Any guidance would be very helpful!

[Suzuki Tomohiro]

Where do you declare the “snapshot” variable?

--
You received this message because you are subscribed to the Google Groups "Flutter Development (flutter-dev)" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/flutter-dev/e63ac10e-08ca-4f10-b8b2-23015fd71a82n%40googlegroups.com.

[Andrew Villegas]

Thanks for your reply, Suzuki.

I guess I haven't declared this variable yet. I'm just a bit confused as to how I can reference the Firestore document that is being fetched, starting with the FutureBuilder:

child: FutureBuilder<QuerySnapshot>(
    future: widget.value.get(),
    builder: (context, snapshot) {

and ending with the 'snapshot.data.docs'.

if (snapshot.connectionState == ConnectionState.done) {
  //Display data inside listview
  return ListView(
    padding: EdgeInsets.only(top: 5.0, bottom: 12.0),
    children: snapshot.data.docs.map((document) {

return Container...

Any guidance would be very helpful. Thank you in advance.

[Suzuki Tomohiro]

Declare the “snapshot” variable.

[Andrew Villegas]

Will do, Suzuki! :)

This is how I'm declaring my snapshot (now 'productId') variable so far:     DocumentSnapshot productId = ?

but like I said earlier, I'm stuck as to how to reference the tapped item in the code that follows.

class ProductContainer extends StatefulWidget {
  final CollectionReference value;

  const ProductContainer({Key key, this.value}) : super(key: key);
  @override
  _ProductContainerState createState() => _ProductContainerState();

}

class _ProductContainerState extends State<ProductContainer> {
  navigateToDetailsPage(DocumentSnapshot productId) {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => ProductsDetailsPage(
          productId: productId,
        ),

      ),
    );
  }
  DocumentSnapshot productId = 

  @override
  Widget build(BuildContext context) {
    return GestureDetector

(
      onTap: () {
        navigateToDetailsPage(productId);

      },
      child: Container(
        child: FutureBuilder<QuerySnapshot>(
            future: widget.value.get(),
            builder: (context, snapshot) {

To view this discussion on the web visit https://groups.google.com/d/msgid/flutter-dev/CAHWORbp7TA16LFnJk%2BvEhFSbDQ3gGW%3D_wr%3Dn-VKFW-8wr9Q2Bw%40mail.gmail.com.

[Suzuki Tomohiro]

In your code where is the tapped DocumentSnapshot instance?

[Andrew Villegas]

I think this is related to the 'children' inside my listview which I'm currently using to display the product's info on this page:

children: snapshot.data.docs.map((document) {

[Andrew Villegas]

Also, I'm reading the DocumentReference class Documentation but I don't think they indicate what I'm looking for. It just describes the properties and methods but not how to use this class. 

[Suzuki Tomohiro]

What is missing information in the documentation?

> children: snapshot.data.docs.map((document) {

Use this "document" variable to assign "DocumentSnapshot productId".

[Andrew Villegas]

I managed to do this. For some reason, I had a GestureDetector as a parent widget of the ListView that I was using to display my products. I simply reversed this order so I could access the snapshot.data.docs.map(document).

Thank you so much for your help, Suzuki. This means a lot!

Best,

Andrew V.

[Suzuki Tomohiro]

Glad to hear that. You’re welcome.