React Render 来自 JSON 对象的 HTML 对象

Question

我必须在 React JS 中渲染 html 对象数组谁能指导我如何使用 renderHTML 函数。对象的输出是这样的： “

 const items = this.state.Data.map(item => (
      <div key={item._id}>{renderHTML("{item.albComEn}")}</div>

another variation i tried 

const items = this.state.Data.map(item => (
      <div key={item._id}>{renderHTML("item.albComEn")}</div>
    ));

我得到的输出=> "item.albComEn" 要么 {item.albComEn}

Answer 1

您可以尝试使用模板字符串。更多信息

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

const items = this.state.Data.map(item => (
      <div key={item._id}>{renderHTML(`${item.albComEn}`)}</div>

Answer 2

您还可以使用 React Fragments 的短语法，即“<> ”。使用这些括号来编写 html 代码。呈现后 html 代码将成功编译。示例：

const service = [
        {
            htmlCode: <>
             <div>
               <h2>Application Screening</h2>
               <br />
               <br />
               What you can expect from us:<br />
                -   Your resume will be written by a team of seasoned experts<br />
                -   They will make sure that your Resume presents your strong points,
                    achievements & key skills in a recruiter-friendly format.<br />
             </div>
            </>
        },
]

使用内部渲染方法作为

...
 render(
  <div>
       {service[0].htmlCode}
  <div>
 )
}

React Render 来自 JSON 对象的 HTML 对象

React Render HTML object from JSON object

json

render-html

reactjs