aionclaw客户端ui不刷新是因spa下状态变更未触发dom重绘；需确认是否为react/vue组件，避免直接改对象属性，应使用函数式更新或forceupdate，并监听ipc事件task-status-updated确保后端广播。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
用户在 AionClaw 桌面客户端中执行自动化任务或调用技能后，前端界面状态已变更（如任务完成标记、进度条更新、日志追加），但 UI 未实时刷新，仍显示旧数据。
确认是否处于 SPA 模式下的本地渲染环境
AionClaw 客户端界面基于 Electron 构建，内嵌 Chromium 渲染引擎，所有页面均为单页应用（SPA）；【状态变更不会自动触发 DOM 重绘，必须显式通知视图层】。若你正在开发自定义技能插件或修改内置 UI 模块，需确认当前组件是否使用 React/Vue 等框架管理状态——直接修改 JS 对象属性（如 task.status = 'done'）不会触发响应式更新。
打开开发者工具（Ctrl+Shift+I / Cmd+Option+I），在 Console 中输入 window.__aionclaw?.env，若返回 "electron" 且 isDevMode 为 true，说明你正处于可调试的本地开发环境，后续操作全部生效。
强制触发 React 组件重新渲染
方法一：使用函数式状态更新避免闭包陷阱
在自定义技能的 React 组件中，禁止使用形如 setTask({...task, status: 'done'}) 的浅拷贝写法（当 task 是深层嵌套对象时，引用未变，React 浅比较后跳过更新）。改用 useReducer 或 useState 的函数式更新：
setTask(prev => ({ ...prev, status: 'done', updatedAt: Date.now() }));
这一步必须包含一个**运行时唯一变化的字段**（如时间戳），否则即使对象内容变了，React 仍可能跳过渲染。
方法二：绕过 React Diff，手动 forceUpdate
仅限紧急修复或调试场景。在组件内引入 useRef 和 useImperativeHandle，暴露 forceUpdate 方法：
const forceUpdate = useRef(() => {});<br>useImperativeHandle(ref, () => ({ forceUpdate: () => forceUpdate.current() }));<br>useEffect(() => { forceUpdate.current = () => setState({}); }, []);
调用时直接执行
ref.current.forceUpdate() 即可。注意：【此操作会丢弃当前组件所有局部状态，慎用于含表单输入的界面】。
监听 AionClaw 全局事件总线并同步 UI
第一步：在组件挂载时注册事件监听器
使用 AionClaw 提供的 IPC 通道监听任务状态变更事件：
useEffect(() => {<br> const handleTaskUpdate = (event, data) => {<br> if (data.taskId === currentTaskId) {<br> setTask(data);<br> }<br> };<br> window.electronAPI.on('task-status-updated', handleTaskUpdate);<br> return () => window.electronAPI.off('task-status-updated', handleTaskUpdate);<br>}, [currentTaskId]);
第二步：确保后端服务已正确广播事件
AionClaw 的 Hermes Agent 在任务状态变更时默认触发 task-status-updated 事件，但前提是该任务由 hermes.run() 启动且未被 suppressEvent: true 抑制。检查你的技能代码中是否含有类似 hermes.run({ suppressEvent: true }) 的配置——若有，删除它，否则前端永远收不到通知。
第三步：验证事件是否真实发出
在主进程（main.js 或 gateway.js）中临时添加日志：console.log('[IPC EMIT]', channel, data);，然后在任务完成时观察控制台是否有对应输出。没有输出即说明状态变更未走 Hermes 事件流，而是直写数据库或内存变量，此时必须手动补发。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
