Breaking News: Grepper is joining You.com. Read the official announcement!

draft js render html

Mehedi Islam Ripon answered on March 30, 2023 Popularity 1/10 Helpfulness 1/10

answer draft js render html

draft js render html

Comment

To render HTML content in a Draft.js editor, you can use the draft-convert 
library which provides a set of functions to convert Draft.js content state
to and from HTML. Here's an example of how to use draft-convert to render HTML 
content in a Draft.js editor:

1. Install draft-convert:
npm install draft-convert

2. Import the draftToHtml function from draft-convert:
import { draftToHtml } from 'draft-convert';

3. Create a function that converts a Draft.js content state to HTML:
function convertToHtml(contentState) {
  return draftToHtml(contentState);
}

4. Render the HTML content in your editor:
<Editor
  editorState={editorState}
  onChange={setEditorState}
  readOnly
  dangerouslySetInnerHTML={{ __html: convertToHtml(editorState.getCurrentContent()) }}
/>

In this example, we're using the dangerouslySetInnerHTML prop to set the editor's 
content to the HTML output of the convertToHtml function. The editor is also set 
to readOnly mode to prevent the user from editing the HTML content directly.

Popularity 1/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: javascript render-html

Link to this answer
Share Copy Link

Contributed on Mar 30 2023

Mehedi Islam Ripon

0 Answers Avg Quality 2/10

Continue with Google

By continuing, I agree that I have read and agree to Greppers's Terms of Service and Privacy Policy.

draft js render html

Contents

More Related Answers

draft js render html

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.