인프런 커뮤니티 질문&답변
react내에서 map함수에 대한 질문
작성
·
211
0
뜬금없는 질문일수도있는데요. 그 map함수가 원래 배열에 대해서 callback 함수에 대한 작업을 하고 새로이 배열을 return 해주는 메소드로 알고있습니다.
보통 react에서 JSX나 반복작업을 할 때 map을 사용하는데요. 아래 부분은 nodebird에서 해쉬태그를 만들어주는 부분이구요.
해쉬태그가 없던 있던간에 .. 예를들면 map에서 return이
[135 135]
['#135', '#123', 123 543]
이런식으로 되면.. html에서 <div>['#135', '#123', 123 543]</div>
이런식으로 나와서 문제가 생기는거 아닌가요? 그동안 생각을 안해보고 쓰긴했는데 곰곰히 생각해보니 배열을 return해주는데 배열은 표시가 안되고 <div>'#135', '#123', 123 543</div> 이런식으로 잘 출력이 되고...
JSX 같은 경우에도 배열 없이 태그만 딱 잘 나오더라고요.
react에서 map을 쓸 경우에는 배열말고 안에 내용물만 return 하도록 그렇게 라이브러리 적으로 설정이 되어있는 걸까요?
function PostCardContent({ postData }) {
return (
<div>
{postData.split(/(#[^\s#]+)/g).map((v, i) => {
if (v.match(/(#[^\s#]+)/)) {
return (
// eslint-disable-next-line react/no-array-index-key
<Link href={`/hashtag/${v.slice(1)}`} key={i}>
<a>{v}</a>
</Link>
);
}
return v;
})}
</div>
);
}




