HTML рендер не происходит

Question

Я получаю ответ json от бэкэнда, как:

{'status': 0, 'type': 'BASIC_HTML', 'content': '<h1>Hello World </h1>'}

Я передаю ответ html как:

if (props.text.type == "BASIC_HTML") {
    return (
        <div>
            {props.text.content}
        </div>
    )
}

Однако вывод получается как <h1>Hello World </h1>

Это не как HTML.Пожалуйста, помогите.

Answer 1

Вы можете попробовать с опасно SetInnerHTML

   if (props.text.type == "BASIC_HTML") {
      return (
         <div>
             <h1 dangerouslySetInnerHTML={{__html: props.text.content}}></h1>
         </div>
      )
  }

Answer 2

JSX не состоит из строк.

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

{'status': 0, 'type': 'BASIC_HTML', 'content': 'Hello World'}

И узел <h1> должен быть записан как JSX, а не строка:

if (props.text.type == "BASIC_HTML") {
    return (
        <div>
            <h1>{props.text.content}</h1>
        </div>
    )
}