无法使用官方示例在 Slate.js 编辑器中明确删除链接

问题描述

enter image description here

CodeSandBox 示例:

https://codesandbox.io/s/slate-2-images-and-links-forked-s09wi

这基本上是官方文档中的withLink() example

当您按退格键或剪切键删除链接时,JSON 输出仍包含带有空文本的链接数据。我不明白为什么它仍然保留在输出中。任何人都可以为此提供解决方案吗?

withLink 示例:

const withLinks = editor => {
  const { insertData,insertText,isInline } = editor

  editor.isInline = element => {
    return element.type === 'link' ? true : isInline(element)
  }

  editor.insertText = text => {
    if (text && isUrl(text)) {
      wrapLink(editor,text)
    } else {
      insertText(text)
    }
  }

  editor.insertData = data => {
    const text = data.getData('text/plain')

    if (text && isUrl(text)) {
      wrapLink(editor,text)
    } else {
      insertData(data)
    }
  }

  return editor
}

const unwrapLink = editor => {
  Transforms.unwrapNodes(editor,{
    match: n =>
      !Editor.isEditor(n) && SlateElement.isElement(n) && n.type === 'link',})
}

const wrapLink = (editor,url) => {
  if (isLinkActive(editor)) {
    unwrapLink(editor)
  }

  const { selection } = editor
  const isCollapsed = selection && Range.isCollapsed(selection)
  const link: LinkElement = {
    type: 'link',url,children: isCollapsed ? [{ text: url }] : [],}

  if (isCollapsed) {
    Transforms.insertNodes(editor,link)
  } else {
    Transforms.wrapNodes(editor,link,{ split: true })
    Transforms.collapse(editor,{ edge: 'end' })
  }
}

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)