前两篇我们分别拆解了 index.js 的核心逻辑和 template.js 的渲染魔法，今天这篇不聊代码细节，专门讲讲我在开发 《魔卡塔防》 排行榜时踩过的几个让人抓狂的坑。
💡这些坑官方文档未必写，搜索引擎也难找到答案——但一旦碰上，绝对让你怀疑人生。在调用wx.getFriendCloudStorage返回的数据中获取好友和自身数据，但是一旦要在排行榜上给区分这些数据哪些是代表用户自己的数据时，就会发现没有一个具体标识来识别哪些数据是用户本身的。wx.getFriendCloudStorage 返回的数据中，不包含用户自己的信息。你需要额外调用 wx.getUserInfo 传入 ['selfOpenId'] 才能拿到自己的完整资料。// 第一步：获取自己的资料wx.getUserInfo({ openIdList: ['selfOpenId'], success: (res) => { const selfBaseInfo = res.data[0]; // 第二步：再请求好友列表，遍历匹配 wx.getFriendCloudStorage({ success: (friendRes) => { // 用 nickName + avatarUrl 去匹配 selfBaseInfo // 给匹配到的 item 打上 isSelf: true } }); }});
1.现象
在使用Layout画出来的排行榜列表，使用<scrollview>标签做滑动效果，结果发现手指上下滑动毫无反应，仿佛贴了一张静态图。
2.原因
在Cocos开放数据域中不调用updateViewPort，会导致主域与子域的触摸事件和渲染视口不同步，这是排行榜ScrollView无法滑动的根本原因。
// 这一步非常重要，决定了点击、滑动等事件能否正确处理。Layout.updateViewPort({ x: 0, y: 0, width: containerWidth, height: containerHeight});
微信小游戏的开放数据域是一个“半黑盒”的运行环境，文档覆盖不全，很多行为需要靠真机调试一点点试出来。上面这N个坑，每一个都让我卡了半天以上——希望这篇文章能帮你少走弯路。如果你正在开发自己的小游戏，或者对排行榜的技术细节还有疑问，欢迎关注我的公众号，后续我会继续分享《 魔卡塔防 》的开发日志和性能优化实战。🎮 微信🔍 “魔卡塔防”：一款融合卡牌构筑与塔防策略的微信小游戏，排行榜系统正是用以上方案实现的。去好友榜上看看你能排第几？
