뭔 상황이라구요?

Untitled

이렇게 리터럴을 사용하여 개행처리를 한 상태로 문자열을 적어주고

Untitled

Untitled

이렇게 데이터를 JSX 문법을 사용해서 넣어주려고 하는데,

Untitled

이렇게 줄바꿈이 적용되지 않는 것이다 ㅠㅠ

해결방법!

구글링을 통해 알아내었다.

[TIP] React에서 텍스트 줄바꿈하는 간단한 방법

React에서 텍스트 줄바꿈?

const text = "동해물과 백두산이\\n 마르고 닳도록"

위 문장을 React에서 출력하려면 어떻게 해야할까요?일반적으로 JSX에서는 개행 문자(‘\n’)가 동작하지 않아 아래와 같이 출력이 됩니다.

동해물과 백두산이 마르고 닳도록

그러면 아래와 같이 줄바꿈 태그인 <br/>을 사용하면 어떨까요?

const text = "동해물과 백두산이<br/> 마르고 닳도록"

<br/>이 문자 그대로 출력됩니다.

동해물과 백두산이<br/> 마르고 닳도록

아니 그러면 어떻게 해결하나요?