微信小程序按钮点击事件示例代码
作者：干到60岁退休的码农
在微信小程序中,实现按钮点击跳转页面是一个常见的功能需求,这篇文章主要介绍了微信小程序按钮点击事件的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
微信小程序中的点击事件跟vue中的不一样，不是使用@click，而是使用bind:tap
wxml中定义按钮组件
<button bind:tap="onClick">点击</button>
js中定义点击处理事件
// index.js
Page({
data: {
message: '尚未点击'
},
onClick() {
console.log('按钮被点击了');
this.setData({
message: '按钮已被点击！'
});
}
});
点击传参给事件处理
通过data-*属性传参(推荐)
<button bind:tap="addScore" data-type="homeTeam" data-score="3" class="btn score-3">+3</button>
js中获取参数
addScore(e) {
const dataset = e.currentTarget.dataset
const {
score,
type,
} = dataset
if (type === 'homeTeam') {
this.setData({
'homeTeam.score': Number(this.data.homeTeam.score) + Number(score)
})
}
},
this.setData()用于更新数据并触发页面更新。
总结
到此这篇关于微信小程序按钮点击事件的文章就介绍到这了,更多相关微信小程序按钮点击事件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！