为什么在画布里每次点击 Tabs 组件都会触发 leaf.onPropChange 事件（导致重渲染）？

[twinkle77]

Describe the bug (required) / 详细描述 bug（必填）

Antd Tabs 组件的 meta 文件 没有比较特殊的描述，但每次在画布中点击 Tabs 组件，leaf.onPropChange 事件 都会触发，组件的 props 会重新解析，this.setState 的调用导致 Tabs 组件重渲染

关联 issue: https://github.com/alibaba/lowcode-engine/issues/1121 https://github.com/alibaba/lowcode-engine/issues/1118

初步定位是重新解析的 props 跟首次解析的 props 不一致，导致了 1121、1118 点击组件 slot 没了的问题

To Reproduce (required) / 如何复现 bug？（必填，非常重要）

• git clone lowcode-materials 仓库
• git clone lowcode-engine 仓库
• cd lowcode-materials && cd packages/antd-lowcode-materials && npm run lowcode:dev
• 给 lowcode-engine 这行代码 写入 debugger
• 配置 xswitch
• 拖入 Tabs 组件\ Button 组件
• 点击画布里的 Page 组件
• 点击画布里的 Tabs 组件（触发 debug）
• 点击画布里的 Button 组件
• 点击画布里的 Tabs 组件（触发 debug）
• .....

发现每次点击 Tabs 组件都会触发 leaf.onPropChang 事件

xswitch 配置如下

{
  "proxy": [
    [
      "https://alifd.alicdn.com/npm/@alilc/lowcode-engine@1.0.14/dist/js/engine-core.js",
      "http://localhost:5555/js/engine-core.js"
    ],
    [
      "https://alifd.alicdn.com/npm/@alilc/lowcode-engine@1.0.14/dist/css/engine-core.css",
      "http://localhost:5555/css/engine-core.css"
    ],
    [
      "https://alifd.alicdn.com/npm/@alilc/lowcode-react-simulator-renderer@1.0.14/dist/js/react-simulator-renderer.js",
      "http://localhost:5555/js/react-simulator-renderer.js"
    ]
  ],
}
···

[LeoYuan]

具体是哪个 prop 发生了变化呢？

一般可以引发值变化的操作：

• 属性初始化，比如选中节点，设置面板在初始化时会调用属性的 defaultValue ，也比如节点销毁/重新构造（表单容器类场景）
• 属性被修改，显式的调用了 setPropValue 之类的设置型 API

[twinkle77]

具体是哪个 prop 发生了变化呢？

一般可以引发值变化的操作：

• 属性初始化，比如选中节点，设置面板在初始化时会调用属性的 defaultValue ，也比如节点销毁/重新构造（表单容器类场景）
• 属性被修改，显式的调用了 setPropValue 之类的设置型 API

Tabs 组件的 Items 属性发生了变化，触发了 leaf.onPropChange 事件 ，Items 属性比较特殊，有一个 children 子属为JSSlot

---

大佬

• 你说的 选中节点， 并不一定触发 leaf.onPropChange 事件，如果不通过 setter 更改组件的 prop，只会在组件首次拖拽进画布触发 leaf.onPropChange 事件
• 其他情况下，选中节点，比如在画布里点击任何节点，我测试过程中，发现只有 Tabs 组件会触发 leaf.onPropChange 事件，尽管 Tabs 组件的 props 没有任何变化

如上图，此时 鼠标 高亮在 button 组件 或 Alert 组件，都不会触发 onPropChange，但高亮在 Tabs，onPropChange 事件会触发

其回调参数看到 Tabs 组件的 item prop 发生变化

old value 的值：

new value 的值：

@LeoYuan