Поддержание формата текста при передаче данных

Question

У меня есть текст (абзацы), хранящийся в моей базе данных, который включает разрывы строк. Когда я делаю GET-запрос к базе данных, информация возвращается как объект. Часть с текстом превращается в один большой сгруппированный абзац. Кто-нибудь знает, как я могу поддерживать разрывы строк и формат текста при передаче текста вокруг?

Answer 1

Вы можете разбить разрывы строк на массив и использовать функцию map, чтобы показать и стилизовать их так, как вы хотите. Вот простое решение, которое можно изменить в соответствии с вашими потребностями:

const myObj = {
  text: 'Very large text\nLine1\nLine2\nLine3'
};
const text = myObj.text.split('\n');

class App extends React.Component {
  render() {
    return ( 
        <div>
        {text.map((t, i) => <div key={i}>{t}</div>)}
        </div>
      );
  }
}

ReactDOM.render( < App / > ,
  document.getElementById('root')
);

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script><div id="root" />