/
jonca3d
/
CourseOnReac
Обзор
Документация
Войти
/
jonca3d
/
CourseOnReac
Код
Запросы
0
Задачи
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
src/pages/Blog/Blog.jsx
38 строк
1 KB
Evgeniy
Blog post page complete
24 сен 2024, 13:40
24 сен 2024, 13:40
7cd587d
Код
Авторство
О чём код?
import { useEffect } from "react"; import Layout from "../../components/Layout/layout"; import { useState } from "react"; import { useNavigate } from "react-router-dom"; import styles from "./Blog.module.css"; function Blog() { const [posts, setPosts] = useState([]); const navigate = useNavigate(); // https://fakestoreapi.com/ useEffect(() => { fetch('https://fakestoreapi.com/products') .then(res => res.json()) .then(json => { console.log(json); setPosts(json) }); }, []); return ( <> <Layout> <div className={styles["blog-container"]}> {posts.map(({ title, price }, i) => ( <div key={`id-${i + 1}`} onClick={() => navigate(`./${i + 1}`)} > <h3>{title}</h3> <p>Price: {price}</p> </div> ))} </div> </Layout> </> ) } export default Blog;