标签：绑定 微信 程序开发 js num 事件 operation data

文章目录

⼩程序中绑定事件，通过bind关键字来实现,如bindtap,bindinput,bindchange,不同的组件支持不同的事件
小案例,输入框与页面之间的事件联动
wxml

<input bindinput="handleInput" />
<view>{{num}}</view>

js

// pages/cart/cart.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
      num:0
  },
  handleInput(e){
      //获取页面初始化属性
      this.setData({
        num: e.detail.value
        }  )

  }

 
})

对于一个点击事件
js

  //加 减号按钮事件
handletap(e){
    // 1. 获取自定义属性 operation
    const operation = e.currentTarget.dataset.operation
    //重新获取data中值
    this.setData({
      num: this.data.num += operation
      }  )
  }

wxml

<input bindinput="handleInput" />
<button bindtap="handletap" data-operation="{{1}}">+</button>
<button bindtap="handletap" data-operation="{{-1}}">-</button>
<view>{{num}}</view>

特别注意
1.绑定事件时不能带参数?不能带括号以下为错误写法

<input bindinput="handleInput(100)" />

2.事件传值,通过标签自定义属性的方式和value

<input bindinput="handleInput" data-item="100" />

3.获取值

 const operation = e.currentTarget.dataset.operation

标签：绑定,微信,程序开发,js,num,事件,operation,data
来源： https://blog.51cto.com/u_13985831/2835279

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。