命令:Commands
当编辑富文本的时候,用户可能会插入文本,删除文本,分隔段落,添加格式等等。这些编辑行为都可以用两个概念来说明:命令和操作。
命令(Commands)是代表用户特定意图的高级操作。它们是 Editor
接口的辅助函数。辅助函数包含了一些富文本常用的核心行为,但是建议你编写针对自己特定模型的命令。
比如,下面这些是内置命令:
Editor.insertText(editor, 'A new string of text to be inserted.')
Editor.deleteBackward(editor, { unit: 'word' })
Editor.insertBreak(editor)
但是你可以(一定会)定义自己的自定义命令。比如,你可能会根据允许的内容类型定义 formatQuote
命令, insertImage
命令,或者是 toggleBold
命令。
命令总是描述将要进行的操作,就好像是用户自己在执行一样。由于这个原因,它们从不需要定义执行命令的位置(location),因为它们总是对当前的选择范围执行操作。
🤖 命令的概念基本上来自于 DOM 内检的
execCommand
API。然而 Slate 定义了自己的简单(并且可扩展)的API ,因为 DOM 版本的API 表现过于不一致(opinionated and inconsistent.)。
因此,Slate 将每一个命令转换为一系列的底层操作(operations),这些操作用来产生一个新的值。这就是协同编辑可以实现的原因。同时你不用担心这些问题,因为它是自动完成的。
自定义命令
在编写自定义命令时,你可以创建自己的命名空间:
const MyEditor = {
...Editor,
insertParagraph(editor) {
// ...
},
}
你通常会使用 Slate 的 Transforms
来编写自定义命令。
转换:Transforms
转换(Transforms)是一个特殊的辅助函数,它允许你对文档执行各种特定的更改,比如:
// 对选中的所有文本节点设置粗体。
Transforms.setNodes(
editor,
{ bold: true },
{
at: range,
match: node => Text.isText(node),
split: true,
}
)
// 把光标所在的最后一个块转换为引用块。
Transforms.wrapNodes(
editor,
{ type: 'quote', children: [] },
{
at: point,
match: node => Editor.isBlock(editor, node),
mode: 'lowest',
}
)
// 在指定路径(path)处插入一个新的文本用来替代原来的文本。
Transforms.insertText(editor, 'A new string of text.', { at: path })
// ...还有省略的其他变换操作!
转换辅助函数被设计为一个集合。所以你可能在每个命令中都会使用到它的一部分。