CODEWITHSUNDEEP
draftjsreact-draft-wysiwyg
fisch
fisch

Reputation: 128

How to push a content state to a current editor state? editorState.push method seems not work for me?

there are some plain text content need to insert to exist textEditor, I try to use EditorState.push method, what I think it's work for the situation. I try something like this:

const { ContentState: { createFromText }, EditorState: { createWithContent, push }} = DraftJS;
export const pushTextToCurrentEditorState = (text, editorState) => {
    const textContentState = createFromText(text);
    const newEditorState = push(editorState, textContentState, 'insert-characters');
    // debugger;
    console.log(editorStateToJSON(editorState))
    console.log(editorStateToJSON(newEditorState))
    return JSON.parse(editorStateToJSON(newEditorState));
}

result is newEditorState is not the merge state ,but replace one, older editorState miss, newEditorState become brand new thing like create from the text. Is here something wrong usage? or there are some other ways to resolve the problem?

Upvotes: 3

Views: 1590

Answers (1)

fisch
fisch

Reputation: 128

I tired a complex way but solve this problem. code here:

export const pushTextToCurrentEditorState = (text, editorState) => {
 
    const textContentState = createFromText(text);
    const textContentBlocksArr = textContentState.getBlocksAsArray();
    const currentBlocksArr = editorState.getCurrentContent().getBlocksAsArray();
    const newBlocksArr = currentBlocksArr.concat(textContentBlocksArr);
    const newContentState = createFromBlockArray(newBlocksArr);
    const newEditorState = createWithContent(newContentState);

    return JSON.parse(editorStateToJSON(newEditorState));
}

way: 1. convert content state, text, to blocks array; 2. combine two blocks array together; 3. create new content state and editor state with combined array;

Upvotes: 2

Related Questions