[04]SocialGallery Project

Main 게시글

Main 게시글

1) UploadForm으로부터 데이터를 보내고 Main 게시글에 등록하는 작업

데이터 불러오기

useEffect(()=>{
  axios.get('https://jsonplaceholder.typicode.com/photos?id=1&id=2')
  .then(res =>{
    setMainImg([...res.data])
    console.log(res.data)
  })
},[])

2) map함수로 데이터를 반복

main.jsx
        {
            mainImg
              .map((a,i)=><Content 
            key={a.id}
            mainImg={mainImg} 
            i={i}
            pfUser={pfUser}
            setPfUser={setPfUser}
            ></Content>
            )
        }

3) 데이터 바인딩
나중에 BackEnd와 변수명을 일치할 예정

content.jsx

	...(생략)

      <div className="post__medias" >
      	<img src={mainImg[i].thumbnailUrl} alt="" />
      </div>


    ...(생략)
    
         <div className="post__title">
          <span>{mainImg[i].title}</span>
        </div>

	...(생략)