import React, {useEffect, useState} from "react"; import "../css/Article.css" import {Routes, Route, Link, useNavigate, Navigate } from 'react-router-dom'; import { useParams } from 'react-router-dom'; function Article({data}) { const [ _id, title, content, images, author, keyword, latitude, longitude, comments, likes, createdAt] = data; const navigate = useNavigate(); function MoveTo(link){ navigate(link) } let listItem = [] listItem = images.map((el)=>{ // http://localhost:8080/uploads/21701487062905.png return( <img src={`http://localhost:8080/${el.replaceAll("\\", "/").substring(7)}`} alt={`http://localhost:8080/${el.replaceAll("\\", "/").substring(7)}`} style={{ width: "100px", height: "100px"}}/> )}); return ( <div class="article" onClick={()=>{console.log(_id); MoveTo(`/post/${_id}`)}}> <h1>{title}</h1> <h2>{keyword}</h2> <h3>{author.nickname} {createdAt}</h3> <p>{content}</p> <p>{listItem}</p> <p>댓글: {comments.length} // 조와요: {likes.length}</p> </div> ); } export default Article;