Slate.js中使用Transforms.setNodes更新自定义节点文本失败求助

你遇到的问题是能成功定位到variable节点并更新其id属性，但无法修改该节点下子文本节点的内容。结合你的代码和Slate的特性，问题出在文本节点的匹配规则上，以下是具体解决思路和修正方案：

1. 修正节点属性判断（若存在笔误） #

你的variable节点结构中使用的是id: '12345'，但代码中判断条件是node.variableId === variableId，这会导致无法正确匹配节点。如果这是笔误，先修正判断条件：

if (node.id === variableId && Element.isElement(node)) {
  variableChipPath = path;
  break;
}

2. 显式指定匹配文本节点 #

Slate的Transforms.setNodes默认仅匹配Element类型节点，而文本节点属于Text类型。更新文本节点时，必须通过match选项明确指定匹配规则：

const updateVariableName = (editor, variableId, updatedName) => {
  let variableChipPath = null;

  for (const [node, path] of Node.nodes(editor)) {
    if (node.id === variableId && Element.isElement(node)) {
      variableChipPath = path;
      break;
    }
  }

  if (variableChipPath) {
    const textNodePath = [...variableChipPath, 0];
    Transforms.setNodes(
      editor,
      { text: updatedName },
      { 
        at: textNodePath,
        match: n => Text.isText(n) // 显式匹配文本节点
      }
    );
  }
}

3. 验证目标节点路径 #

如果仍有问题，可以先通过Node.get确认路径是否指向正确的文本节点：

const targetNode = Node.get(editor, textNodePath);
console.log(targetNode); // 应输出 { text: 'Text to be changed' }

核心原因说明 #

Slate对文本节点和元素节点有严格的类型区分，Transforms.setNodes默认不会处理文本节点，因此必须显式声明match规则才能触发更新。而更新元素节点（如修改id）时不需要额外指定，因为默认匹配规则就是元素节点。

内容的提问来源于stack exchange，提问作者Gavin Baxter