[React] html 태그가 적용된 상태로 텍스트 나타내기

admin에서 편집기를 사용해서 글을 작성하면 사용자 페이지에서 해당 내용을 받아와 나타내야 했다. 

 

물론 이미지 파일 또한 첨부가 가능해야 했고, 편집기에서 이미지를 업로드 했을 시 사용자 페이지에서 이미지가 아닌 태그가 텍스트로 나타나는 현상이 발생했다. 

 

이를 해결하기 위해

dangerouslySetInnerHTML 를 사용했다. 

 

<div className="content" dangerouslySetInnerHTML={{__html: blog && blog.content}} />

위와 같이 __html의 값으로 태그를 적용할 내용을 넣어주면 해당 div 안에서 태그가 적용된 상태로 텍스트를 나타낼 수 있다.