reactjs 如何在使用SlateJS Package 节点时忽略空行？

92vpleto 于 2022-11-29 发布在 React

关注(0)|答案(1)|浏览(111)

我正在使用Slate.js构建一个富文本编辑器。我设置了一个内联格式，可以使用以下函数切换：

toggleInline: function (editor, format) {
  const isActive = this.isFormatActive(editor, format, TYPES.FORMATS.INLINE);

  if (isActive) {
    Transforms.unwrapNodes(editor, {
      match: node => !this.isEditor(node) && Element.isElement(node) && node.type === format
    });

  } else {
    const inline = { type: format, children: noChildren };
    Transforms.wrapNodes(editor, inline, { split: true });
  }
}

它工作正常，但如果我选择多行，我想忽略空行，这样就不会插入空块。例如，我只想换行A和B，但不想换行：

相应的子级如下所示：

[
  { type: "p", children: [{ text: "A" }]},
  { type: "p", children: [{ text: "" }]},
  { type: "p", children: [{ text: "B" }]}
]

我尝试在wrapNodes上添加一个match选项，但它擦除了空行，而不是跳过它们：

Transforms.wrapNodes(editor, inline, {
  match: node => node.text !== emptyString
  split: true
});

我该怎么办呢？

reactjs

来源：https://stackoverflow.com/questions/74501521/how-to-ignore-empty-lines-while-wrapping-nodes-with-slatejs

1条答案

按热度按时间

imzjd6km1#

事实证明，match选项是可行的，我只需要使用一个适当的函数来检查元素是否为空：

Transforms.wrapNodes(editor, inline, {
  match: (node) => !Element.isEmpty(node),
  split: true
});

我的自定义isEmpty函数：

isEmpty: function (element) {
  if ("text" in element) return element.text === emptyString;
  if (element.children.length > 1) return false;

  return this.isEmpty(head(element.children));
}

赞(0）回复(0）举报 2022-11-29

我来回答

reactjs 如何在使用SlateJS Package 节点时忽略空行？

1条答案

相关问题

热门标签

最新问答