Can't get data from firestore by Id on my ProductDetail page

user_15419698 0
Viewed 63

I've created a dynamic routing for a ProductDetail page (each Restaurant has its own details that should be shown on this page). the routing is working but I don't get any data and I can't figure out the right way to get data from firestore by the Id of each restaurant.

Update:

Now the product details are rendering in the console but the the problem still how to return them in my detailpage

Update !! : ProductDetail.js

import { useParams, useRouteMatch } from "react-router-dom";
import { firestore } from "../../../../../fire";

function ProductDetail() {
  const { productId }= useParams();

  const [product, setProduct] = useState();

  useEffect( () =>  {
 
   firestore
     .collection("Restaurants")
     .doc(productId).get()
     .then( doc => {
       console.log(doc.data())
       setProduct(doc.data());
     })
   }, () => {

 }
 );
 
  return (
    <div className="col-12">
      <div className="card">
        <h1>{productId.name_restaurant} </h1>
        <p>Price:${productId.Currency}</p>
        <p>{productId.email} </p>
      </div>
    </div>
  );
  }
export default ProductDetail;

this my console : all details of the restaurant are returned

enter image description here

Still cannot return details on my page

enter image description here

google-cloud-firestore reactjs javascript
1 Answers
import React, {useEffect, useState} from "react";
import { useRouteMatch } from "react-router-dom";

function ProductDetail() {
  const { params: {productId} }= useRouteMatch("/react/ecom-product-detail/:productId");
  const [product, setProduct] = useState(null);

  useEffect(() => {
    firestore
      .collection("Restaurants")
      .doc(productId)
      .get()
      .then((snap) => setProduct(snap.data()));
  }, []);

  return (
    <div className="col-12">
      <div className="card">
        <h1>{product.name_restaurant}</h1>
        <p>Price:${product.Currency}</p>
        <p>{product.email} </p>
      </div>
    </div>
  );
}

export default ProductDetail;
user_88904630
Related