DB데이터 state함수에 넣기

[강의현]

위의 사진처럼 DB에서 데이터를 찾아 get요청으로 데이터를 찾아오는 것까지 성공했습니다.

문제는 아래 사진같이 찾아온 데이터를 title이라는 오브젝트 데이터 하나만 state 함수에 넣어 map함수로 반복문을 돌리는 중에 계속 오류가 납니다.

postTitle이라는 state에 DB에서 찾아온 데이터를 넣을 때 제가 놓치고 있는 부분이 있을까요?

서버에서 보낼 때 응답.json(결과)로 보냈기 때문에 문자형식으로 보내져 이 데이터를 오브젝트, 어레이 형식에 맞게 수정하는 방법이 있을까요?

 

function PostAlert (props){

let history = useHistory();

return (
<div className="postalert">
<h2> 게시글 작성이 완료되었습니다! </h2>
<Button variant="secondary" onClick={() => {
history.push('/board')
axios.get('http://localhost:3000/post')
.then((결과) => {
console.log(결과.data)
<strong>props.setPostTitle(결과.data.title)</strong>
})
.catch(() => {
console.log('get요청 실패')
})
}}>확인</Button>
</div>
)
}

 

[codingapple]

결과.data 출력해보면 array자료라서

결과.data.title 이러면 아무것도 안나올 것 같은데 그래서 그런듯요 

[강의현]

array안에 object가 여러개 들어있을 때 array안의 모든 object의 특정 key값만을 뽑아볼 수 있을까요?

console.log(결과.data.title)이런식으로 했을 때는 정의되지 않았다고 나옵니다.

console.log(결과.data[0].title)이런식으로 했을 때는 결과값이 나오는데 하나의 object의 value값만 나옵니다.

모든 title의 value값을 map함수로 반복 돌리고싶습니다. 

[codingapple]

결과.data.map() 하면 안에있던 object 출력가능할듯요

[강의현]

며칠 헤매다 댓글 주신 답변을 실마리로 해결했습니다. 일일이 답변주셔서 감사드립니다.

[글쓴이]

글