Попытка отобразить визуализированный HTML в каком-то поле в моем приложении, однако он показывает исходный код

Question

Я делаю небольшой проект и хочу отобразить некоторый текст, который я получаю как HTTP-ответ, в некотором текстовом поле.Я получаю текст html, но когда я пытаюсь его отобразить, он не форматирует текст, а показывает простой текст с тегами.Пожалуйста, смотрите прикрепленный скриншот для справки.

Я использую response.js на внешнем интерфейсе.Не уверен, что есть специальные правила, которые я пропустил.

Я попытался обернуть ответ в тег div, textarea и article.Ничего не получилось.

Пожалуйста, помогите!

Это мой компонент:

const Show = (props) => (
  <div className='content'>
    <a href={props.job.url}><span className='ListEntryTitle'>{props.job.title} 
    </span></a>
    <p className='ListEntryCompany' style={{margin: "0 0 0 0"}}> 
    {props.job.company}</p>
    <p className='ListEntryType'>{props.job.type}</p> 
    <article className="box" type="text/html" style={{width: "auto", height: 
    "350px", overflow: "auto"}}>{props.job.description}</article>
    <button className="button" onClick={props.saveJob}>Save</button>
    <button className="button" onClick={props.nextJob}>Next</button>
    <div>
      <button className="button" onClick={props.newSearch}>new Search</button>
    </div>
  </div>
)

Снимок экрана

Answer 1

Если ваш html идет как строка со стороны сервера, тогда вы можете попробовать то, что я сделал ниже. Было бы хорошо, если бы вы дали ссылку fiddle, чтобы каждый мог помочь вам.

<article className="box" style={{width: "auto", height: "350px", overflow: "auto"}} dangerouslySetInnerHTML={{ __html: props.job.description }}></article>