国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

使用JSX將WYSIWYG編輯器中的字串的一部分替換
P粉060112396
P粉060112396 2023-08-17 10:28:01
0
1
651
<p>我有一個由WYSIWYG編輯器輸入提供的字串,例如:</p> <pre class="brush:js;toolbar:false;">const originalString = "<div>一些文字</div><strong>一些加粗文字{{response}}</strong> "; </pre> <p>我需要用一些JSX取代<code>{{response}}</code>,並將結(jié)果輸出為HTML。 </p> <p>我認為我不能使用<code>dangerouslySetInnerHTML</code>,因為它不處理JSX。相反,你會得到以下輸出:</p> <pre class="brush:html;toolbar:false;"><div>一些文字</div> <strong>一些加粗文字 [object Object]</strong> </pre> <p>在這裡查看範例。 </p> <p>有沒有一種方法可以用JSX取代<code>{{response}}</code>,然後在渲染時將字串的其餘部分轉(zhuǎn)換為有效的HTML? </p>
P粉060112396
P粉060112396

全部回覆(1)
P粉486138196

這是你想要的嗎?

import React, {renderToString} from "react";
import "./style.css";
import * as ReactDOMServer from 'react-dom/server';

export default function App() {
  return (
    <StringReplacement />
  );
}

class StringReplacement extends React.Component {
  render() {
    //這可以是從所見即所得編輯器中作為字符串的任何有效的HTML
    const originalString = "<div>some text</div><strong>some strong text {{response}}</strong>";

    // 用JSX內(nèi)容替換'{{response}}'
    const jsxReplacement = <span onClick={ () => alert('')}>JSX content here</span>;
    const replacedString = originalString.replace('{{response}}', ReactDOMServer.renderToString(jsxReplacement));

    return (
      <div>
        <div dangerouslySetInnerHTML={{ __html: replacedString }} />
      </div>
    );
  }
}

export default StringReplacement;
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板