1. 触摸事件：
- bindtouchstart： 手指触摸动作开始。
- bindtouchmove： 手指触摸后移动。
- bindtouchend： 手指触摸动作结束。
<!-- WXML 中的触摸事件 -->
<view bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd">触摸我</view>
// 逻辑层中的触摸事件处理函数
Page({
touchStart: function(event) {
console.log('触摸开始', event)
},
touchMove: function(event) {
console.log('触摸移动', event)
},
touchEnd: function(event) {
console.log('触摸结束', event)
}
})
2. 表单事件：
- bindinput： 输入框输入内容时触发。
- bindblur： 输入框失焦时触发。
- bindsubmit： 表单提交时触发。
<!-- WXML 中的表单事件 -->
<input type="text" bindinput="inputHandler" bindblur="blurHandler" />
<button bindsubmit="submitHandler">提交</button>
// 逻辑层中的表单事件处理函数
Page({
inputHandler: function(event) {
console.log('输入框输入内容', event.detail.value)
},
blurHandler: function() {
console.log('输入框失焦')
},
submitHandler: function() {
console.log('表单提交')
}
})
3. 自定义事件：
在组件中，可以通过 triggerEvent 来触发自定义事件，然后在父组件中使用 bind 来监听。
<!-- 子组件的 WXML -->
<view bindtap="tapHandler">点击我触发自定义事件</view>
// 子组件的逻辑层
Component({
methods: {
tapHandler: function() {
this.triggerEvent('myCustomEvent', { data: '自定义数据' })
}
}
})
<!-- 父组件的 WXML -->
<child-component bindmycustomevent="customEventHandler" />
// 父组件的逻辑层
Page({
customEventHandler: function(event) {
console.log('收到自定义事件', event.detail.data)
}
})
以上是一些微信小程序中常用的事件类型和处理方式。根据具体的页面和组件需求，你可以选择合适的事件类型进行绑定和处理。
转载请注明出处：http://www.zyzy.cn/article/detail/772/微信小程序