How to append data on JavaScript?(React.js) [duplicate]

Question

I want to append some JSON data to frontend(React.js) After fetching the JSON data, I want to append the data to JSX. The data looks like below: (The value of description is string)

data = { description: "<p>Description Content</p><ul><li>list1</li><li>list2</li><li>list3</li<li>list4</li></ul>" }

I want to append this to JSX, how can I do that?

const Desctiption = ({ data }) => {
  const { description } = data;

  return (
    <div className="description-tag">

    </div>
  )
}
export default Desctiption;

froston · Accepted Answer · 2021-05-13 14:56:33Z

0

Try this:

const Desctiption = ({ data }) => {
  const { description } = data;

  return (
    <div className="description-tag">
      <div dangerouslySetInnerHTML={{ __html: description }} />
    </div>
  )
}
export default Desctiption;

However this approach might be risky. Check out the docs for more information: https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml

answered May 13, 2021 at 14:56

froston

1,1971 gold badge13 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to append data on JavaScript?(React.js) [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related