How do I display data created by SunEditor in a ReactJS app

2k views Asked by At

I just started working with SunEditor and so far I have successfully added it to a React component and am storing the resulting document in mongoDB when clicking save. So far that's half the battle. Now I want to render the stored document and I have the data back from the db in the same component but when I render it all of the HTML is being displayed (see image). I'm having a difficult time locating the documentation on properly displaying this data. Does anyone know what the correct way to do this is?

screenshot

1

There are 1 answers

2
Tim Manchester On BEST ANSWER

OK, so I spent some time thinking about it and it occurred to me that the editor itself is where you render the text. It then made sense that if you want to show documents created in SunEditor, you put the contents inside it and hide the toolbar if you're going for a read-only view of the data.

Here's a snipped from the render method in my component that does that:

        return (
            <Auxi>
                <Logo />
                <SunEditor 
                    setOptions={editorOptions} 
                    setContents={contents} 
                    showToolbar={showToolbar} />
            </Auxi>
        );