I am using dangerouslySetInnerHTML in my React application (TypeScript based).

I am using it like this:

 <div dangerouslySetInnerHTML={{ __html:  faq.answer  }}/>

I am getting this error:

Type 'string | Element' is not assignable to type 'string'.

is there any way to fix this?

I am getting HTML from server like this <p>hello</p>. My output is correct. But while creating build my build breaks because we are doing typechecking before build.

CodePudding user response：

You haven't provided much detail, but, assuming you want to serialize faq.answer in the case that it's an element, you can use Element.outerHTML like this:

<div dangerouslySetInnerHTML={{ __html: typeof faq.answer === 'string'
  ? faq.answer
  : faq.answer.outerHTML }}/>