react 띄어쓰기

react에서 string[] 을 리턴하는데 구분하는 쉼표 다음의 띄어쓰기가 적용이 안되는 문제가 있었다.

// 문제의 코드
{hashTags?.map((tag, index) => {
  return (
    <span key={index}>
    {tag}
 {!(index === hashTags.length - 1) && ', '}
 </span>
 );
})}

// 수정한 코드
{hashTags?.map((tag, index) => {
  return `${tag}${!(index === hashTags.length - 1) && ', '}`;
})}

span으로 감싸서 리턴하던 것을 백틱으로 감싸서 리턴하는 것으로 바꾸니 백틱안에선 ', '의 띄어쓰기도 잘 인식한다.

검색해보니  를 사용하라는 포스트들이 많던데 여기에선 적용이 되지 않았다.