As per title, what I'm trying to achieve is to display the Wysiwyg content from the Editor to another component.
I created a sample on codesandbox here: https://codesandbox.io/s/boring-tharp-zwflu
As you can see, the editor works fine and is returning the values as it should.
My issue here is I'm not able to convert that String I get returned, into JSX tags.
I did a deep search, but couldn't find anything related.
Thank you in advance for your time and help!
You have to install
npm i react-html-parser
import it to your component
import ReactHtmlParser from "react-html-parser";";
and render it
<div className="wysiwyg">
{ReactHtmlParser(wysiwyg)}
</div>
I actually found the solution at the end, sorry for not having updated it already!
Here the answer I got from TinyMCE for this issue: https://github.com/tinymce/tinymce-react/issues/138
So, you should use directly a parser, in this case react-html-parser will do the job.
I created another codesandbox so you can directly have a look at the working copy: https://codesandbox.io/s/crazy-greider-dl2mv
Hope that help!
Actually on 2023-10-02 is not working correctly something is with dependencies (last relies is 6 years ago), so anyone who read this use html-react-parser instead.
Here is the dependency problem with react-html-parser discussed and found a solution:
