/
gutguty
/
first-spring
Обзор
Документация
Войти
/
gutguty
/
first-spring
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
develop
client/src/layouts/MainLayout/MainLayout.jsx
48 строк
1 KB
Bogdan
Add client on react
22 июл 2026, 20:10
22 июл 2026, 20:10
229f065
Код
Авторство
О чём код?
import React, {useEffect, useState} from 'react'; import './MainLayout.css' import {getAll} from "@/api/api.js"; import Card from "@/components/Card/index.js"; import CardModal from "@/components/CardModal/index.js"; const MainLayout = () => { const [cards, setCards] = useState([]) const [selectCard, setSelectCard] = useState(null) useEffect(() => { const fetchCards = async () => { try { const response = await getAll(); setCards(response) } catch (err) { console.error(err.message) } } fetchCards() },[]) return ( <div className="main"> <ul className="main__list"> {cards.map((card) => ( <li className="main__list-item" key={card.id}> <Card title={card.title} price={card.price} image={card.image} onCardClick={() => setSelectCard(card)} /> </li> ))} </ul> {selectCard && ( <CardModal card={selectCard} onClose={() => setSelectCard(null)} /> )} </div> ); }; export default MainLayout;