如何清除 Slate.JS 编辑器中的所有文本

Question

对于我的生活，我无法弄清楚如何从 slate.js 清除编辑器组件中的所有文本。

我努力了：

Transforms.delete(editor, {}); -> doesn't do anything

editor.deleteBackward("line"); -> only deletes one line, not all

我也尝试手动重新渲染编辑器组件，不幸的是没有将它更新到初始状态:(

我一直在翻阅 slate js 文档，但在任何地方都找不到任何东西！如果有人有任何想法，会很高兴。

这是编辑器的实现方式：

  const editor = useMemo(() => withHistory(withReact(createEditor())), []);

 <Editable
      key={stateKey}
      onKeyDown={(event: any) => handleKeyDown(event)}
      style={{ overflowWrap: "anywhere", width: "100%" }}
      onPaste={(e) => {
        if (e.clipboardData) {
          if (e.clipboardData.files.length > 0) {
            setFiles([...files, ...Array.from(e.clipboardData.files)]);
            e.preventDefault();
          }
        }
      }}
      decorate={decorate}
      renderLeaf={renderLeaf}
      placeholder="What's happening?"
    />

Answer 1

您可以改变 editor.children 并将其设置为“空”值。

const editor = useMemo(() => withHistory(withReact(createEditor())), []);

editor.children = [
    {
        type: "paragraph",
        children: [{ text: "" }]
    }
];

笔记: Slate 至少需要一个包含一个空文本节点的数组才能正确呈现。

Answer 2

可以使用

   // loop delete all
   editor.children.map(item => {
     Transforms.delete(editor, { at: [0] })
   })
    
   // reset init 
   editor.children = [
   {
         type: "p",
         children: [{ text: "" }]
   }
   ];