html字符串到html（反應前端）

Question

這是我想用reactDOM渲染的字符串：

<!DOCTYPE html><html><head><title>Websockets 101</title><meta charset="utf-8"><link rel="shortcut icon" href="#"><link rel="stylesheet" href=
"https://fonts.googleapis.com/css?family=Roboto"><link rel="stylesheet" href="../stylesheets/styles.css" type="text/css"><link rel="stylesheet" href
="../stylesheets/projects_showcase.css" type="text/css"><link rel="stylesheet" href="../stylesheets/portfolio/portfolio.css" type="text/css"><!-- Bo
otstrap--><!--link(rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css")--></head><body id="portfolio"></bo
dy></html><div><h1>This is the story of a bread named brown</h1><p>bread was brown and was also named brown</p><p>thus he was brown</p></div>

我嘗試了以下操作:(僅顯示渲染方法） this.state.note_html是html文檔字符串

        return (
                <div style={{background: 'red', width: '300px', height: '300px'}}>
                    <h1>Hello</h1>
                    <button onClick={this.fetchHTML}>Click me</button>
                    {this.state.note_html}
                </div>

我沒工作。 它只是把它渲染成一個字符串。

結果：

Answer 1

嘗試這個：

return (
   <div style={{background: 'red', width: '300px', height: '300px'}}>
      <h1>Hello</h1>
      <button onClick={this.fetchHTML}>Click me</button>
      <div dangerouslySetInnerHTML={this.createMarkup()} />;
   </div> );
...
createMarkup() {
  return {__html: this.state.note_html};
}

html字符串到html（反應前端）

問題描述

1 個解決方案

解決方案1
0 2019-03-24 19:34:42

html字符串到html（反應前端）

問題描述

1 個解決方案

解決方案1 0 2019-03-24 19:34:42

解決方案1
0 2019-03-24 19:34:42