когда нечего делать, а творческая душа требует реализации и хочется что-то сделать или написать, то я пишу сюда или делаю что-то на этом сайте. Кому интересна web-разработка, wordpress и то что рядом с этим, то заходите на мой сайт и читайте всякое...
Йо-йо! Представим, что с сервера к нам приходит текст, который содержит перенос строк. Мне кажется, что именно это стало причиной по которой вы зашли на эту страницу. Я угадал?!)
Вставить html в react’е очень просто:
/** dangerouslySetInnerHTML - вот то, что вам нужно */
<div dangerouslySetInnerHTML={innerHTML}></div>
Но само уже название свойство элемента нам, как бы, подсказывает, что лучше бы им не пользоваться…. А чем пользоваться, чтобы сделать разметку текста?! Сейчас я вам расскажу.
Вставляем текст с сервера на страницу
Представим, что с сервера к вам при шёл текст с переносом строк. Этот текст мы должны разбить на строки и распечатать JSX
const value = responce.text // Тут храниться наш текст с сервера
const arrStrings = value.split('\n') // разбиваем текст по строкам
arrStrings.map((str, i) => <p key={`p_${i}`}>{str}</p>)
Всего одна строка кода и вы пользуетесь архитектурой реакта, а не опасными методами.
P.S.
Если вы хотите, чтобы я записал видио на тему, которая вас интересует то подпишитесь на мою группу в ВК и расскажите, чтобы вы хотели прочитать или увидеть на моём youtube канале.
О планах
В ближайшее время (написано 14.09.2020) ко мне приедет один девайс и вы сможете не только читать блог и слышать меня, но и видеть на моём youtube-канале. Ближайший ролик будет о подсветке найденового текста при поиске в элементах (react).
Поддержи Xakplant
Я давно хочу развить видеоверсию, но пока этого не получается из-за нехватки ресурсов. Сейчас я собираю деньги на новый компьютер и микрофон. Поддержи xaklant и ты увидишь полезные видео быстрее.