反应 - HTML 元素内部到字符串

Question

我有一个 object 我想在这个 object 中设置一个 html 元素

    {
        titleName: "Indorction",
        heading: 'Welcome to JavaScript',
        iconName: faDotCircle,
        description: [
            `
            Do we even need to introduce `${<p>HTML element</p>}`? It’s one of the most popular programming 
            languages on the planet!
            Ever visited a website that made you think…"Hey, this website is really cool and
            `
        ],
    },

Answer 1

我不确定如何标记为重复，但您可以在这里找到答案： 在 React 组件中将 HTML 字符串渲染为真正的 HTML

基本上你想将一个字符串呈现为 HTML，这是一种危险的做法，所以要小心。

const x = {
        titleName: "Indorction",
        heading: 'Welcome to JavaScript',
        iconName: faDotCircle,
        description: [
            `
            Do we even need to introduce <p>HTML element</p>? It’s one of the most popular programming 
            languages on the planet!
            Ever visited a website that made you think…"Hey, this website is really cool and
            `
        ],
    },

在你的渲染 function 里面：

<div dangerouslySetInnerHTML={{ __html: x.description }}></div>

Answer 2

JavaScript_Lessons_Objects.js

{
    titleName: "Indorction",
    heading: 'Welcome to JavaScript',
    iconName: faDotCircle,
    description: [
      `
       Do we even need to introduce <b class="hal">JavaScript</b>? It’s one of the most 
       popular programming languages on the planet!.
      `
   ],
},

课程.jsx

{ReactHtmlParser(this.props.lesson[this.state.indexDescription]["description"])}