[JSX] 리액트 줄바꿈

개행이 포함된 긴 문장을 작성했다.

 

내가

작성한 

그대로

줄바꿈을 하

기 위해서 style

에 white-spa

ce 요소를 추가해도

적용이 안됨

 

화면에 이렇게 나왔으면 좋겠는데

 

내가 작성한 그대로 줄바꿈을 하기 위해서 style에 white-space 요소를 추가해도 적용이 안됨

 

계속 이렇게 나왔음

 

방법은 아래처럼...

 

<Typography align="center" variant="h6" style={{ whiteSpace: 'pre-line' }}>
  {
    `내가 
     작성한 
     그대로 
     줄바꿈을 하
     기 위해서 style
     에 white-spa
     ce 요소를 추가해도 
     적용이 안됨`
  }
</Typography>

 

 

{} 중괄호 안에 `` 백틱을 사용한다

white-space 요소엔 pre-line 또는 pre-wrap 원하는대로...