I've list of emojis. Each of them has its own unicode. With Modifier.insertText(), I would like to insert them to the text.
_addEmoji(text) {
const { editorState } = this.state;
const selection = editorState.getSelection();
const contentState = editorState.getCurrentContent();
const txt = '&#x' + text + ';';
let nextEditorState = EditorState.createEmpty();
if (selection.isCollapsed()) {
const nextContentState = Modifier.insertText(contentState, selection, txt);
nextEditorState = EditorState.push(
editorState,
nextContentState,
'insert-characters'
);
} else {
const nextContentState = Modifier.replaceText(contentState, selection, text);
nextEditorState = EditorState.push(
editorState,
nextContentState,
'insert-characters'
);
}
this.onChange(nextEditorState);
}
I expect to see 😄 inserted to the editor but it displays row 😄 instead.
I've inserted <meta charset="utf-8" /> to <head /> and the list of emoji is rendered perfectly. The main problem is the draftjs editor displays raw unicode instead of the emoji.
Any thoughts to fix this? Thanks.