copy/paste problems

[GreatItLove]

it is not working properly on copy/paste event. for example, it cant copy bold style text and another thing is that when you paste something, the line height is too high and each line, there is additional paragraph.

Let me know how to solve these issues.

Thanks.

[sneerin]

this component do pasting better : https://github.com/froala/react-froala-wysiwyg

[o-svetlichnyi]

try to add handlePastedText <Editor handlePastedText={() => false} />

[aaronjhoffman]

try to add handlePastedText <Editor handlePastedText={() => false} />

This worked well for me, unfortunately, it's nowhere to be found in the documentation.

[aberba]

handlePastedText={() => false}

@aaronjhoffman Can you please file an issue on it? since you know much about it. Please.

[nelsoneldoro]

handlePastedText={() => false} it workes on Linux but does not work on mac 😕

[nelsoneldoro]

Based on https://github.com/jpuri/react-draft-wysiwyg/blob/7b328659f1251a17a2547b357b41502dcc25611b/src/utils/handlePaste.js I have swiped the lib that converts html to draft. I have used draft-js-import-html

import {Editor} from 'react-draft-wysiwyg';
import {stateFromHTML} from 'draft-js-import-html';

...

handlePastedText = (text, html, editorState, onChange) => {
    const selectedBlock = getSelectedBlock(editorState);
    if (selectedBlock && selectedBlock.type === 'code') {
      const contentState = Modifier.replaceText(
        editorState.getCurrentContent(),
        editorState.getSelection(),
        text,
        editorState.getCurrentInlineStyle(),
      );
      onChange(EditorState.push(editorState, contentState, 'insert-characters'));
      return true;
    } else if (html) {
      const blockMap = stateFromHTML(html).blockMap;
      const newState = Modifier.replaceWithFragment(
        editorState.getCurrentContent(),
        editorState.getSelection(),
        blockMap,
      );
      onChange(EditorState.push(editorState, newState, 'insert-fragment'));
      return true;
    }
    return false;
};

[Fredxingxing]

Based on https://github.com/jpuri/react-draft-wysiwyg/blob/7b328659f1251a17a2547b357b41502dcc25611b/src/utils/handlePaste.js I have swiped the lib that converts html to draft. I have used draft-js-import-html

import {Editor} from 'react-draft-wysiwyg';
import {stateFromHTML} from 'draft-js-import-html';

...

handlePastedText = (text, html, editorState, onChange) => {
    const selectedBlock = getSelectedBlock(editorState);
    if (selectedBlock && selectedBlock.type === 'code') {
      const contentState = Modifier.replaceText(
        editorState.getCurrentContent(),
        editorState.getSelection(),
        text,
        editorState.getCurrentInlineStyle(),
      );
      onChange(EditorState.push(editorState, contentState, 'insert-characters'));
      return true;
    } else if (html) {
      const blockMap = stateFromHTML(html).blockMap;
      const newState = Modifier.replaceWithFragment(
        editorState.getCurrentContent(),
        editorState.getSelection(),
        blockMap,
      );
      onChange(EditorState.push(editorState, newState, 'insert-fragment'));
      return true;
    }
    return false;
};

thx for the code, but it won't work with the pasted word has backgroundColor , any suggestion for me ? QAQ

[latati]

try to add handlePastedText <Editor handlePastedText={() => false} />

This solution worked for me too, thx. Should be in the documentation! But it doesn't work with the pasted word has backgroundColor

[dattruong88vn]

try to add handlePastedText <Editor handlePastedText={() => false} />

Good job :))

[chuoidamduoi]

cố gắng thêm handlePastedText <Editor handlePastedText={() => false} />

amazing good job iem 👍︎

[paulomatos777]

<Editor handlePastedText={() => false} /> work perfectly :)

[fudgi]

you can also do stripPastedStyles={true}

https://github.com/jpuri/react-draft-wysiwyg/issues/552#issuecomment-398294694