Skip to content

fix: 撤销/重做时补发 NODE_PROPERTIES_CHANGE,支持 Vue3 自定义节点属性回滚渲染#2380

Draft
Copilot wants to merge 3 commits intomasterfrom
copilot/fix-node-properties-change-on-undo
Draft

fix: 撤销/重做时补发 NODE_PROPERTIES_CHANGE,支持 Vue3 自定义节点属性回滚渲染#2380
Copilot wants to merge 3 commits intomasterfrom
copilot/fix-node-properties-change-on-undo

Conversation

Copy link

Copilot AI commented Mar 2, 2026

setProperties 触发的属性更新可被 NODE_PROPERTIES_CHANGE 监听,但 undo/redo 通过 graphDataToModel 回放历史时会重建 model,未走 setProperties 链路,导致 Vue3 自定义节点无法感知属性回滚并更新样式。

  • 核心修复:在历史回放后补齐属性变更事件

    • LogicFlow 中新增 emitNodePropertiesChange(preGraphData, curGraphData)
    • 对比回放前后同一节点的 properties,仅对发生变化的节点发出 EventType.NODE_PROPERTIES_CHANGE
    • 事件 payload 与现有语义保持一致:id / keys / preProperties / properties
  • 接入点:仅修改 undo/redo 路径

    • undo() / redo() 在执行 graphDataToModel(...) 前抓取当前图数据快照。
    • 回放后调用 emitNodePropertiesChange(...),确保监听 NODE_PROPERTIES_CHANGE 的自定义节点在撤销/重做时也能收到属性变化通知。
  • 覆盖用例:补充历史回放事件行为

    • packages/core/__tests__/logicflow.test.ts 增加用例:
      • setProperties 后执行 undo(),应收到属性从新值回退的事件;
      • 再执行 redo(),应收到属性恢复的事件。
undo() {
  const preGraphData = this.graphModel.modelToGraphData()
  const graphData = formatData(this.history.undo()!)
  this.clearSelectElements()
  this.graphModel.graphDataToModel(graphData)
  this.emitNodePropertiesChange(preGraphData, graphData)
}
Original prompt

This section details on the original issue you should resolve

<issue_title>[Feature]: 撤销操作时,vue3自定义节点 怎么能感知到撤销时的属性变换,并根据撤销后属性渲染节点</issue_title>
<issue_description>### 背景&目的

当setProperties方法使属性变化,自定义节点中使用 graphData?.eventCenter.on(EventType.NODE_PROPERTIES_CHANGE, ()=>{}) 事件,获取变化后属性 进行节点样式渲染。
遇到问题: 但执行撤销操作时,目前节点无法感知到属性变化,也就无法渲染节点样式。
举例:比如resize节点大小后,在撤销时,实际width height已经回到撤销前,但是vue节点内width 和 height没有变化
需求:请问有没有什么方案可以解决这个问题</issue_description>

<agent_instructions>可以看下提供的代码,然后查找下原因,感觉问题是因为properties的改变没有添加到history上,先尝试修复,提pr的时候用中文标题需要使用feat/fix/style: 这样的格式 正文写清楚原因以及写清楚修复了哪些部分,关联哪些issue</agent_instructions>

Comments on the Issue (you are @copilot in this section)

@CraneReturn 这边方便提供下demo示例吗 方便我们复现下~~ @CraneReturn > [@CraneReturn](https://github.com/CraneReturn) > > [demo.zip](https://github.com/user-attachments/files/24876600/demo.zip) > > 20260127-152555.mp4 > nodes/ANode/index.vue 是自定义节点用EventType.NODE_PROPERTIES_CHANGE事件监听属性变化,但是在撤销时,无法回退到上一次属性值,目前是用监听HISTORY_CHANGE事件来解决, 看看有没有什么其他比较好的方案

ok我这边排查下原因~感谢提供demo!</comment_new>


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

@changeset-bot
Copy link

changeset-bot bot commented Mar 2, 2026

⚠️ No Changeset found

Latest commit: 1a06d81

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Copilot AI and others added 2 commits March 2, 2026 07:29
Co-authored-by: CraneReturn <127602190+CraneReturn@users.noreply.github.com>
Co-authored-by: CraneReturn <127602190+CraneReturn@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix node properties change detection on undo operation fix: 撤销/重做时补发 NODE_PROPERTIES_CHANGE,支持 Vue3 自定义节点属性回滚渲染 Mar 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature]: 撤销操作时,vue3自定义节点 怎么能感知到撤销时的属性变换,并根据撤销后属性渲染节点

2 participants