合约IDE- 事件,世界状态页签闪回问题
【问题分类】
- bug
- P2P网络相关(包含libp2p,liquid)
- 链账户身份与权限相关(证书问题、public、多签投票问题)
- 核心交易引擎相关(交易池、DAG)
- 共识相关
- 智能合约相关
- 存储相关
- SDK相关
- 长安链CMC工具
- 长安链管理台
- 长安链浏览器
- 长安链合约IDE
- 长安链web签名插件
- 跨链相关
- 轻节点相关
- 隐私计算相关
- 密码学相关
- 环境依赖
- 其他补充:
【问题描述】
问题概述
SmartIDE 编辑器底部控制台的页签切换功能异常。当用户尝试从默认的 "输出" 页签切换到 "世界状态" 或 "事件" 页签时,页签会短暂显示目标页签内容,但随后立即闪烁并被强制重置回 "输出" 页签,导致用户无法正常查看世界状态和事件的调试信息。
重现步骤
- 打开 SmartIDE 编辑器并加载一个智能合约项目
- 确保底部控制台区域可见,当前默认显示 "输出" 页签
- 点击 "世界状态" 页签
- 实际结果:页签短暂切换到"世界状态"后,立即闪烁并重置回"输出"
- 点击 "事件" 页签,观察到相同现象
预期行为
- 点击 "世界状态" 页签后,应稳定显示世界状态内容
- 点击 "事件" 页签后,应稳定显示事件内容
- 页签切换过程应平滑,不应出现闪烁或自动重置
影响范围
- 影响功能:用户无法查看智能合约的世界状态和事件信息,严重影响调试体验
- 影响程度:高 - 核心调试功能不可用
截图说明
【技术分析与排查建议】
技术栈信息
- 前端框架:React
- 组件类型:Tab/Tabs 组件
- 问题类型:组件状态管理与重渲染问题
可能的原因分析
1. 状态管理与默认值重置
- Tab 组件的
activeKey/value状态可能使用了defaultActiveKey而非受控的activeKey - 组件生命周期或
useEffect中存在将状态重置为硬编码默认值(如'output'或'输出')的逻辑 - 状态未正确持久化,导致每次重渲染时丢失用户选择
2. 父组件重渲染问题
- 父组件频繁或不必要的重渲染导致整个 TAB 模块被重新实例化
- 状态没有正确提升到父组件或使用 Context/Redux 管理
- 重渲染时子组件状态被重置为初始值
3. 组件 key 属性不稳定
- TAB 组件或其容器使用了不稳定的
key属性(如每次渲染生成新的 key) - React 销毁并重新创建组件,导致内部状态(选中项)丢失
4. 数据加载触发的连锁重渲染
- "世界状态" 或 "事件" 页签的数据加载逻辑(Redux/Context/Hooks)在组件挂载后触发了状态更新
- 状态更新连锁触发了 TAB 组件的重渲染,导致选中状态丢失
To upload designs, you'll need to enable LFS and have an admin enable hashed storage. More information
