#node.js #reactjs #mongodb #redux
#node.js #реагирует на #mongodb #возвращение
Вопрос:
импорт { useEffect } из ‘react’; импорт { useSelector, useDispatch } из ‘react-redux’;
// Действия импорт { listProducts } из ‘../redux/действия/productActions’;
const Home = () =gt; {
const dispatch = useDispatch(); const getProduct = useSelector((state) =gt; state.getProduct); const { products, loading, error } = getProduct; useEffect(() =gt; { dispatch(listProducts()) }, [dispatch]); return ( lt;divgt; { loading ? lt;divgt;lt;Box sx={{ width: '100%' }}gt; lt;LinearProgress /gt; lt;/Boxgt;lt;/divgt; : error ? lt;h2gt;{ error }lt;/h2gt; : products.map((product) =gt; ( lt;div className="row center" key={product._id}gt; lt;a href={`/product/${product._id}`}gt; lt;div className="card"gt; lt;img className="medium" src={ product.imageUrl } alt="product" /gt; lt;div className="card-body"gt; lt;h2gt;{ product.name }lt;/h2gt; lt;Rating rating={product.rating} numReviews={product.numReviews} /gt; lt;div className="price"gt; amp;#8358;{ product.price.toLocaleString(undefined, { minimumFractionDigits: 2 }) } lt;/divgt; lt;/divgt; lt;/divgt; lt;/agt; lt;/divgt; ))} lt;/divgt; ) }
Комментарии:
1. В чем именно проблема?
2. На первой странице приложения список продуктов отображается по вертикали, а не по горизонтали
3. Вы должны поделиться реализованными кодами css, чтобы лучше помочь вам
4. Я использую шаблоны. Прежде чем я вызову данные из mongodb, они всегда отображаются в строке, но после вызова они рассеиваются и отображаются по вертикали (столбец)
5. Я думаю, что метод отправки в массиве зависимостей useEffect должен быть удален.
Ответ №1:
Вы должны удалить отправку из массива зависимостей useEffect hook