【界面UI】VIP 徽章与属性面板的联动刷新：属性变更触发的前端联动

实战应用：用在哪里

VIP 等级变化时，头顶徽章、属性面板加成、特权列表三处界面要同时刷新。分散刷新的写法容易漏一处，事件驱动的联动刷新让属性变更自动推给所有订阅的界面，一处触发、处处更新。

事件驱动的刷新

-- 服务端推送 VIP 变更
function pushVipChange(actor, level)
    sendluamsg(actor, 7500, level, 0, 0, "vip")
end

-- 前端订阅 VIP 变更事件
SL:RegisterLuaNetMsg(7500, function(p1)
    SL:onLUAEvent("VIP_CHANGED", { level = p1 })
end)

服务端的 sendluamsg 推送等级变化，前端收到后转发成内部事件 VIP_CHANGED。内部事件的订阅者各自响应：徽章控件换贴图、属性面板改加成数字、特权列表刷新状态，三个界面互不知道对方存在。

界面的订阅实现

-- 徽章控件的订阅
SL:RegisterLUAEvent("VIP_CHANGED", "badgeLayer", function(data)
    local badge = GUI:Image_Create(badgeLayer, "vipBadge", 10, 10, "vip_" .. data.level .. ".png")
    GUI:Image_loadTexture(badge, "vip_" .. data.level .. ".png")
end)

-- 属性面板的订阅
SL:RegisterLUAEvent("VIP_CHANGED", "attrPanel", function(data)
    GUI:Text_setString(attrText, "VIP" .. data.level .. " 加成生效中")
end)

订阅接口（RegisterLUAEvent）带来源标签，界面销毁时按标签注销（UnRegisterLUAEvent），泄漏的订阅在窗口重建后会重复触发。事件的发布与订阅的解耦：服务端推送只发一次，前端几个界面订阅就有几个响应，扩展一个新界面不需要动发布方。徽章的贴图按等级命名，等级变化的贴图热切换让升级的瞬间有可见反馈。

验证与监控

事件的发布数与订阅响应数对账，响应数少于订阅数即为订阅泄漏的信号。

踩坑记录

事件名的拼写不一致曾经让订阅收不到发布（VIP_CHANG 与 VIP_CHANGED），事件名的常量表统一管理。订阅的注销遗漏在快速开关面板的场景高发，注销的配对检查进了界面基类的销毁流程。

上线要点

前端事件的命名规范与后端协议的命名规范同构，跨端的对照表降低联调成本。事件驱动的刷新替代轮询后，CPU 的空转开销下降一个数量级，性能与架构的收益重合。联动刷新的测试用例覆盖所有订阅方，新增订阅方必须补进回归清单。

本文由 996 技术组基于 996 引擎官方知识库与浮生梦老师课程体系整理。团队长期从事传奇类引擎 Lua 后端逻辑、客户端界面与商业版本交付，内容以官方知识库与真实项目为出处，按版本持续修订。