graph.removeNodeData([node.id]) 删除节点是会报错uncaught Error: Node not found for id: 3s1W-xAqQQ

[woderlili]

Describe the bug / 问题描述

  deleteNode = async (event) => {
    console.log(event, 'deleteNode')
    const { graph, element } = this.context
    const node = graph.getNodeData(event.id)
    await graph.removeNodeData([node.id])
    await graph.render()
  }

我是用graph.removeNodeData删除节点的时候，就会报错

当我将graph.render()改成graph.draw()，也会报错

Reproduction link / 复现链接

No response

Steps to Reproduce the Bug or Issue / 重现步骤

No response

Version / 版本

🆕 5.x

OS / 操作系统

• macOS
• Windows
• Linux
• Others / 其他

Browser / 浏览器

• Chrome
• Edge
• Firefox
• Safari (Limited support / 有限支持)
• IE (Nonsupport / 不支持)
• Others / 其他

[github-actions]

@woderlili 您好！以下是关于您问题的自动回复：

您好，感谢您反馈 G6 在节点删除过程中的报错问题。您的描述和代码如下：

deleteNode = async (event) => {
  const { graph } = this.context
  const node = graph.getNodeData(event.id)
  await graph.removeNodeData([node.id])
  await graph.render()
}

报错信息：Error: Node not found for id: 3s1W-xAqQQ

---

原因分析

1. 节点数据未找到或已被删除

   • graph.getNodeData(event.id) 可能返回 undefined，如果传入的 event.id 不存在或已被删除。
   • 若 node 为 undefined，则 node.id 会报错，或者 removeNodeData([node.id]) 删除不存在的节点时也会报错。

2. API用法不一致

   • G6 v5 推荐直接传递节点 ID 数组给 removeNodeData，而不是先查找节点数据。
   • 参考官方用法：

     graph.removeNodeData(['node-1', 'node-2']);

3. 渲染方法选择

   • 通常数据变更后应使用 graph.render() 刷新视图。graph.draw() 适用于样式调整，但数据变更应用 render()。
   • 若节点已不存在，再调用某些渲染逻辑也可能引发异常。

---

推荐解决方案

请参考以下更安全、简洁的写法：

deleteNode = async (event) => {
  const { graph } = this.context;
  // 1. 判断节点是否存在
  const node = graph.getNodeData(event.id);
  if (!node) {
    console.warn(`节点不存在: ${event.id}`);
    return;
  }
  // 2. 直接用 event.id 删除节点
  await graph.removeNodeData([event.id]);
  // 3. 刷新视图
  await graph.render();
}

要点说明：

• 仅传递节点ID给 removeNodeData，不需要先获取节点数据。
• 删除前先判断节点是否存在，避免报错。
• 推荐始终使用 render() 方法刷新视图。

---

其他建议

• 如果想一次删除多个节点，可以传递一个 ID 数组：graph.removeNodeData(['id1', 'id2'])
• 如需同时删除相关边，建议使用 removeData 方法：

  graph.removeData({ nodes: [event.id], edges: [...] });

---

参考文档

• G6 官方 API：removeNodeData
• G6 数据动态管理示例

---

如果还有疑问，欢迎继续补充相关信息或提供最小复现示例。祝您使用愉快！

---

此回复由 AI 助手自动生成。如有任何问题，我们的团队会尽快跟进。

[woderlili]

使用这个方法还是会报错

deleteNode = async (event) => {
    const { graph } = this.context
    // 1. 判断节点是否存在
    const node = graph.getNodeData(event.id)
    if (!node) {
      console.warn(`节点不存在: ${event.id}`)
      return
    }
    // 2. 直接用 event.id 删除节点
    await graph.removeNodeData([event.id])
    // 3. 刷新视图
    await graph.render()
  }

[github-actions]

📝 To help us better understand and address your issue, please provide more information, or use the standard format, otherwise we will not process this issue.

Reference document:

• Creating an issue
• Basic writing and formatting syntax

---

📝 为了帮助我们更好地理解和解决你的问题，请提供更多信息，或者使用规范的格式，否则我们不会处理这个 issue。

参考文档：

• 创建议题
• 基本撰写和格式语法

[yvonneyx]

请提供最小复现代码块❤️

[yvonneyx]

Duplicate of #7466