Javascript CK Editor 内联元素拖放问题

如果任何人以后需要这个功能，你可以参考这个代码

function _getPlaceholderChanges(editor, inGraveyard) {
  const changes = editor.model.document.differ.getChanges({
    includeChangesInGraveyard: inGraveyard,
  });
  let changedItems = [];
  for (const change of changes) {
    if (
      inGraveyard
        ? change.type == "insert" &&
          change.name != "$text" &&
          change.position.root.rootName == "$graveyard"
        : change.type == "insert" && change.name != "$text"
    ) {
      const range = editor.model.createRangeOn(change.position.nodeAfter);
      for (const item of range.getItems()) {
        if (item.is("element", "placeholder")) {
          changedItems.push(item);
        }
      }
    }
  }
  const changedPlaceholders = changedItems.map((item) =>
    item._attrs.get("name")
  );
  return changedPlaceholders;
}

function pipingDeletionChecker(editor, questionId, callback) {
  const model = editor.model;
  model.document.on("change:data", () => {
    // Get changes buffered in Differ. Include items moved to the graveyard (removed from document).
    const removedPlaceHolders = _getPlaceholderChanges(editor, true);
    const addedPlaceHolders = _getPlaceholderChanges(editor, false);

    //if a placeholder deleted and added on same time means, this is happend due to reposition of item (drag and drop).
    //In this case we wont call the callback
    if (removedPlaceHolders.length && !addedPlaceHolders.length) {
      callback(questionId, removedPlaceHolders);
    }
  });
}

export default pipingDeletionChecker;