在微信小游戏开发中,事件(Event)是用于处理用户交互、游戏逻辑、状态变化等的重要机制。微信小游戏支持多种事件类型,比如点击、触摸、输入、自定义事件等。
下面我将分步骤介绍如何在微信小游戏(使用 JavaScript + 微信小游戏 SDK)中增加自定义事件。
✅ 一、微信小游戏事件类型
微信小游戏支持以下事件类型:
| 事件类型 | 说明 |
|---|---|
touchstart |
手指触摸屏幕 |
touchmove |
手指移动 |
touchend |
手指离开 |
click |
点击事件 |
longpress |
长按事件 |
input |
输入事件 |
scroll |
滚动事件 |
custom |
自定义事件(需要自己定义) |
✅ 二、如何增加自定义事件(custom)
在微信小游戏中,自定义事件需要你自己定义事件名称,并在 onEvent 方法中处理。
1. 定义自定义事件名称
在 js 文件中定义一个自定义事件名称,比如:
const CUSTOM_EVENT = 'customEvent';
2. 在页面中触发自定义事件
你可以通过 wx.triggerEvent 或 wx.emit 来触发自定义事件。
方法一:使用 wx.triggerEvent
wx.triggerEvent({
type: CUSTOM_EVENT,
data: {
message: '这是一个自定义事件消息'
}
});
方法二:使用 wx.emit(推荐)
wx.emit(CUSTOM_EVENT, {
message: '这是一个自定义事件消息'
});
3. 在页面中监听自定义事件
在 onLoad 或 onPageLoad 中监听自定义事件:
wx.onEventChannel((res) => {
console.log('自定义事件接收到了:', res);
});
注意:
wx.onEventChannel是在 微信小游戏 中使用,不能在 小程序 中使用。- 如果你使用的是 微信小程序,可以使用
wx.onEventChannel,但需要在app.json中配置。
✅ 三、自定义事件的完整示例
1. 在 js 文件中定义自定义事件
const CUSTOM_EVENT = 'customEvent';
// 触发自定义事件
wx.emit(CUSTOM_EVENT, {
message: '这是自定义事件的消息'
});
2. 在页面中监听自定义事件
wx.onEventChannel((res) => {
console.log('自定义事件收到:', res);
});
✅ 四、注意事项
- 事件名称必须唯一:自定义事件名称不能重复。
- 事件数据格式:事件数据是对象,可以包含任意键值对。
- 事件处理在主线程:微信小游戏的事件处理在主线程中执行,不会阻塞 UI。
- 事件在页面加载后才生效:需要在
onLoad或onPageLoad中监听。
✅ 五、其他事件类型(可选)
如果你需要处理其他事件,比如:
touchstart、touchmove、touchendclicklongpressinputscroll
你可以使用 wx.onXXXEvent 来监听。
✅ 六、总结
| 事件类型 | 说明 |
|---|---|
custom |
自定义事件,需要自己定义并触发 |
wx.emit |
触发自定义事件 |
wx.onEventChannel |
监听自定义事件 |
wx.onXXXEvent |
监听其他事件类型(如 touchstart) |
如果你需要更详细的代码示例或想了解如何在小程序中使用自定义事件,也可以告诉我,我可以继续帮你扩展。