美文网首页
小程序双向绑定

小程序双向绑定

作者: 云之一 | 来源:发表于2021-03-29 09:55 被阅读0次
    • 所有事件监听均为bind+eventName,例如bindinput="callbackFunction"
    • 小程序事件函数中,无法直接传参,须通过自定义属性传参
    • 自定义属性传参 data-变量='''{{value}}' 例如 data-number="{{1}}"
    • 每个事件函数均有一个自行带入参数e
    • 函数中接收自定义传参, e.target.dataset.number
    • input的输入值=e.detail.value
    • 变量赋值 ,this.setData({ varible:value})
    <input type="text" bindinput="handleInput"/>
    <view>{{num}}</view>
    <button bindtap="handleTap" data-number="{{1}}">+</button>
    <button bindtap="handleTap" data-number="{{-1}}">-</button>
    
    Page({
      data: {
        num:0
      },
      handleInput(e){
        this.setData({
          num:e.detail.value
        })
        console.log(e)
      },
      handleTap(e){
        let data = e.target.dataset.number
        this.setData({
          num:this.data.num +data
        })
      }
    })

    相关文章

      网友评论

          本文标题:小程序双向绑定

          本文链接:https://www.haomeiwen.com/subject/neiscltx.html