1

If I drag an image from my local disk into the Lexical editor, the onDrop function can't capture the dragged image node and data. Is is a bug? If the imaged was dragged into the editor and then you drag the inserted image, the onDrop function can capture both the node and data. I want to do some node replacement here. Any help would be appreciated.


function onDrop(event: DragEvent, editor: LexicalEditor): boolean {
  const node = getImageNodeInSelection();
 console.log("[onDrop] Image node : ", node); // node was not captured.
  if (!node) {   
    return false;
  }
  const data = getDragImageData(event);
  console.log("onDrop data: ", data); // data was not captured.

  if (!data) {
    return false;
  }
  event.preventDefault();
  if (canDropImage(event)) {
    console.log("canDropImage event: ", event);
    const range = getDragSelection(event);
    node.remove();

    const rangeSelection = $createRangeSelection();
    if (range !== null && range !== undefined) {
      rangeSelection.applyDOMRange(range);
    }

    $setSelection(rangeSelection);
    editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);
  }
  return true;
}

Lexical version: 0.12.4

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.