Made with create-react-library
npm install draftjs-raw-parser
or
yarn add draftjs-raw-parser
import React from 'react'
import { ParsedData } from 'draftjs-raw-parser'
import { convertToRaw, Editor, EditorState, RichUtils } from 'draft-js'
const App = () => {
const [editorState, setEditorState] = React.useState(() =>
EditorState.createEmpty()
)
const postRawContent = convertToRaw(editorState.getCurrentContent()).blocks
console.log(postRawContent)
const handleKeyCommand = (command: any, editorState: any) => {
const newState = RichUtils.handleKeyCommand(editorState, command)
if (newState) {
setEditorState(newState)
return 'handled'
}
return 'not-handled'
}
return (
<Fragment>
<Editor
editorState={editorState}
onChange={setEditorState}
handleKeyCommand={handleKeyCommand}
placeholder='Content'
/>
{/* Parsed Data */}
<div style={{ border: '1px solid' }}>
<ParsedData
rawContent={JSON.stringify(postRawContent)}
color='#0066ff'
fontSize='20px'
/>
</div>
</Fragment>
)
}
export default App
MIT © aadityarajkumawat