React JSX Question
How to clear input field in Draft-js
None of the demos that I've seen for Draft-js (by Facebook, built on React) show how to clear the input field after submit. For example, see this code pen linked to from awesome-draft-js where the value you submit remains in the input field after submit. There's also no function in the api that seems designed to do it. What I've done to achieve that is to create a new empty state on button submission like this
onSubmit(){
this.setState({
editorState: EditorState.createEmpty(),
})
}
However, since I create an empty state in the constructor when the editor is loaded like this
this.state = {
editorState: EditorState.createEmpty(),
};
I'm worried that I might not be doing it in the right way i.e. the previous state object might become a memory leak. Question: what is the intended way to reset the state in the above situation (i.e. button submit)
Answer Source
It is NOT recommended to use EditorState.createEmpty() to clear the state of the editor -- you should only use createEmpty on initialization.
The proper way to reset content of the editor:
import { EditorState, ContentState } from 'draft-js';
const editorState = EditorState.push(this.state.editorState, ContentState.createFromText(''));
this.setState({ editorState });
@source: https://github.com/draft-js-plugins/draft-js-plugins/blob/master/FAQ.md