微信小程序事件绑定和点击事件
微信小程序事件绑定和点击事件
<!-- 1 需要给input 标签绑定 input 事件 绑定关键字 bindinput 2 如何获取 输入框的值 通过事件源对象来获取 e.detail.value 3 把输入框的值 赋值到 data 当中 不能直接: 1 this.data.num = e.detail.value 2 this.num = e.detail.value 正确的写法: this.setData({ num:e.detail.value }) 4 需要加入一个点击事件 1 bindtap 2 无法在小程序当中的事件中直接传参 3 通过自定义属性的方式来传递参数 4 事件源中获取 自定义属性 -->
demo.wxml
<input type="" bindinput="handleInput"></input> <button bindtap="handtap" data-operation="{ {1}}">+</button> <button bindtap="handtap" data-operation="{ {-1}}">-</button> <view> { {num}}</view>
demo.json
Page({ /** * 页面的初始数据 */ data: { num:0 }, // 输入框的input事件的执行逻辑 handleInput(e){ // console.log(e.detail.value); this.setData({ num:e.detail.value }) }, // 加 减 按钮的事件 handtap(e){ // console.log(e); // 1 获取自定义属性 operation const operation = e.currentTarget.dataset.operation; this.setData({ num: parseInt(this.data.num) + operation }) } })
示例
上一篇:
uniapp开发微信小程序-2.页面制作
下一篇:
微信小程序picker滚动选择器使用详解