Skip to content

Instantly share code, notes, and snippets.

@ysfzrn
Created March 7, 2017 17:33
Show Gist options
  • Save ysfzrn/cf665f9c7cecee9cbcb0df9d661bd3ca to your computer and use it in GitHub Desktop.
Save ysfzrn/cf665f9c7cecee9cbcb0df9d661bd3ca to your computer and use it in GitHub Desktop.
draft js to html || from html
import React, { Component } from 'react';
import { Editor } from 'react-draft-wysiwyg';
import { ContentState,EditorState,convertFromHTML } from 'draft-js';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
import {stateToHTML} from 'draft-js-export-html';
const toolbar = {
options: ['inline', 'fontSize','list', 'colorPicker', 'link', 'emoji', 'history'],
}
class Issue extends Component {
componentDidMount() {
const { issueFormChange,auth } = this.props;
issueFormChange({
['user_id'] : auth.data._id
});
}
handleEditorInput=(text, field)=>{
const { issueFormChange } = this.props;
issueFormChange({
[field] : stateToHTML(text.getCurrentContent())
});
}
render() {
const { issueform } = this.props;
const blocksFromHTML = convertFromHTML(issueform.text);
const state = ContentState.createFromBlockArray(
blocksFromHTML.contentBlocks,
blocksFromHTML.entityMap
);
return (
<Container>
<Editor ref="editor1" toolbar={ toolbar}
onEditorStateChange={(e)=>this.handleEditorInput(e,'text') }
defaultEditorState={EditorState.createWithContent(state)}
placeholder="Buraya yazabilirsin"
/>
</Container>
);
}
}
var mapStateToProps = (state) => {
return {
issueform: state.issueform,
}
}
export default connect(mapStateToProps)(Issue);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment