# #javascript #reactjs #firebase #google-cloud-firestore
Вопрос:
Я создал динамическую маршрутизацию для страницы ProductDetail (у каждого ресторана есть свои собственные сведения, которые должны быть показаны на этой странице). маршрутизация работает, но я не получаю никаких данных и не могу понять, как правильно получать данные из firestore по идентификатору каждого ресторана.
PS: сведения о продукте отображаются в консоли, но проблема все еще в том, как отобразить их на странице сведений
ProductDetail.js
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;
Ответ №1:
Как я вижу, ваше название штата product
и имя парама productId
. В возврате вы использовали productId
неверное значение.
По мере того, как вы сохраняете данные в состоянии. Вы должны написать product
вместо productId
этого, как показано ниже
<div className="col-12">
<div className="card">
<h1>{product?.name_restaurant} </h1>
<p>Price:${product?.Currency}</p>
<p>{product?.email} </p>
</div>
</div>
Комментарии:
1. К сожалению, это не работает, и я получаю эту ошибку : Ошибка типа : react__WEBPACK_ИМПОРТИРОВАННЫЙ_МОДУЛЬ_1__по умолчанию(…) не является функцией для строки
const { productId }= useParams();
2. Если это так. Как вы получали данные на консоли
3.Я решил эту проблему, но все еще не могу ничего отобразить даже после добавления продукта вместо ProductID Ошибка : Ошибка типа: Не удается прочитать свойство ‘name_restaurant ‘неопределенного Ps; данные отображались в консоли
4. Добавить а ? после такого продукта, как
product?.name_restaurant
5. Также делайте это для других. Это проверка не определена