Конвертирование содержимого HTML в HTML

Ответ 1

Я менеджер по работе с клиентами в Contentful -

Вы можете проверить список рекомендуемых парсеров по языку на наших часто задаваемых вопросах.

Кроме того, не стесняйтесь отправлять нам сообщения на Intercom через наш интерфейс, нажав ссылку "Поговорить с нами":)

Ответ 2

Я знаю, что опаздываю, но здесь решение с использованием рулей:

var marked = require('marked');
marked.setOptions({
  renderer: new marked.Renderer(),
  sanitize: true,
  smartLists: true,
  smartypants: true
});

//Home
router.get('/', (req, res) => {
  client.getEntry('<ENTRY_ID>')
  .then( (entry)=> {
    entry.fields.body = marked(entry.fields.body);
    res.render('static/index',
     {
       entry: entry,
       user: req.user
     });
  }).catch( (err) => {
    console.log(err);
  })
});

Затем в нашем шаблоне index.hbs мы можем вызвать переменную уценки в этом случае (entry.fields.body), используя {{{}}}, чтобы предотвратить экранирование.

{{{entry.fields.body}}}

Ответ 3

Вот как я это сделал с React:

class NewsDetail extends React.Component {
    render() {
        const body = marked(this.props.body || "");
        return (
                <div className="news-detail">
                <h2>{this.props.title}</h2>
                <div dangerouslySetInnerHTML={ { __html: body } }></div>
                </div>
        );
    }
}

Содержимое разметки сохраняется в атрибуте body тега NewsDetail (через короткую функцию, которая отображает контентную структуру данных в структуру моего приложения).

HTML-страница имеет этот тег script, чтобы вытащить отмеченную функцию:

<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.6/marked.min.js"></script>

Ответ 4

Я использовал модуль ReactMarkdown: в случае, если у вас также есть приложение реагирования: https://github.com/rexxars/react-markdown

Пример: npm install --save react-markdown

const React = require('react')
const ReactDOM = require('react-dom')
const ReactMarkdown = require('react-markdown')

const input = '# This is a header\n\nAnd this is a paragraph'

ReactDOM.render(
  <ReactMarkdown source={input} />,
  document.getElementById('container')
)

Я передаю уценку через реквизит и использую этот модуль внутри моего дочернего компонента.

Ответ 5

Я также сделал то же самое, что и Маргарита в приложении реагирования, но в дочернем компоненте, и я вытащил уценку из контента.

Я установил пакет реакционной уценки

с

npm установить реактивную уценку

import React from "react";
import ReactMarkdown from "react-markdown";

const AboutIntro = (props) => {
    return (
        <div>

            <h2 className="about__intro-title">
                {props.aboutTitle}
            </h2>

            <ReactMarkdown>
                {props.aboutCopy}
            </ReactMarkdown>

        </div>
    )
}
export default AboutIntro;

надеюсь это поможет