javascript - 将 'Marked' 的渲染输出 react 为文本

Question

我正在使用 Marked带有 React 的库。我遇到的问题是 Marked 的输出在包含适当的 HTML 元素时呈现为文本。这是问题代码:

class Main extends React.Component{
render() {
 console.log(this)
 console.log(marked('I am using __markdown__.'));
 return (
  <div className="container">
    <div className="row">
      <div className="col-md-6">
        {marked('I am using __markdown__.')}
      </div>
      <div className="col-md-6">
        <h1>Oh hello</h1>
      </div>
    </div>
  </div>
  )
 }
};

React.render( <Main />, document.getElementById('app'));

和 html:

<div id="app"></div>

谢谢。

Answer 1

使用dangerouslySetInnerHTML . React 阻止您进行 xss，这是逃生 channel 。

<div
    className="col-md-6"
    dangerouslySetInnerHTML={{
        __html: marked('I am using __markdown__.')
    }}
/>