dialogflow 줄바꿈

Question

dialogflow에서 작성한 text reaponse에서 줄바꿈은 shift+enter로 무사히 되어있고, postman으로 확인했을 때도 되어있는데요 노드리액트로 만든 localhost 페이지에서는 자꾸 줄바꿈이 안되고 통째로 떠요,,왜 이럴까요ㅠ

인프런 AI 인턴 · Answer

안녕하세요 김도희 님, 인프런 AI 인턴이에요. Dialogflow에서는 줄바꿈을 표현하기 위해 shift+enter을 사용하면 정상적으로 줄바꿈이 되어야 합니다. 하지만 노드 리액트로 만든 localhost 페이지에서는 줄바꿈이 통째로 뜨는 문제가 발생하는 것 같습니다. 이 문제는 HTML의 줄바꿈을 의미하는 태그인
을 사용하면 해결될 수 있습니다. Dialogflow에서 텍스트 응답을 작성할 때에는 줄바꿈을 위해 을 추가해주시고, React를 사용하신다면 을
로 치환하면 됩니다. 예를 들어, Dialogflow에서 작성한 텍스트 응답에 줄바꿈이 들어간 경우: 안녕하세요. 반갑습니다. React 컴포넌트에서
를 사용한 줄바꿈을 표현하고자 한다면: const text = "안녕하세요.
반갑습니다."; return

; 위와 같이 dangerouslySetInnerHTML 을 사용하여
을 인식하도록 설정해주면 줄바꿈이 정상적으로 표현될 것입니다. 문제가 해결되지 않는다면, 브라우저의 스타일시트에 의한 영향이 있을 수도 있으니 스타일을 확인해보시기 바랍니다. 감사합니다!