收藏
回答

button官方示例代码中按钮事件绑定有问题

问题模块 框架类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 button 工具 6.6.3 1.9.90


先贴代码再说明问题

//button.wxml

<button type="default" size="{{defaultSize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="default" hover-class="other-button-hover">
  default
</button>
<button type="primary" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="primary">
  primary
</button>
<button type="warn" size="{{warnSize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="warn">
  warn
</button>
<button bindtap="setDisabled">点击设置以上按钮disabled属性</button>
<button bindtap="setPlain">点击设置以上按钮plain属性</button>
<button bindtap="setLoading">点击设置以上按钮loading属性</button>
<button open-type="contact">进入客服会话</button>

//button.js

var types = ['default', 'primary', 'warn']
var pageObject = {
  data: {
    defaultSize: 'default',
    primarySize: 'default',
    warnSize: 'default',
    disabled: false,
    plain: false,
    loading: false
  },
  setDisabled: function (e) {
    this.setData({
      disabled: !this.data.disabled
    })
  },
  setPlain: function (e) {
    this.setData({
      plain: !this.data.plain
    })
  },
  setLoading: function (e) {
    this.setData({
      loading: !this.data.loading
    })
  }
}
 
for (var i = 0; i < types.length; ++i) {
  (
    function (type) {
      pageObject[type] = function (e) {
        console.log('type=' + type, 'e=' + e)
        var key = type + 'Size'
        var changedData = {}
        changedData[key] = this.data[key] === 'default' ? 'mini' : 'default'
        console.log('changedData=' + changedData.text)
        this.setData(changedData)
      }
    }
  )(types[i])
  console.log('types[i]=' + types[i])
}
 
Page(pageObject)

问题是button.js中最后的for循环代码,作用是点击3个按钮,大小在default和mini之间切换,但是有几个问题没搞懂:

①3个按钮绑定了点击事件,但是写响应函数写在for循环里面了,不是传统的写法,不知道怎么理解。

②for循环的写法看不懂

for(...){
  (
      ...
  )(...)

这算什么写法?最后一个小括号里面写了个types[i]是什么意思??????

最后一次编辑于  2018-02-13  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

3 个回答

  • 赵青山
    赵青山
    2018-02-14

    常见的js闭包写法,(function(){})()是调用函数的意思

    2018-02-14
    赞同
    回复
  • phoenixor
    phoenixor
    2018-02-14

    (function(){})是创建匿名函数然后直接调用它吗?

    最后那个(types[i])是什么意思?

    2018-02-14
    赞同
    回复
  • 赵青山
    赵青山
    2018-02-15

    那个匿名函数有个参数,你没看到?

    2018-02-15
    赞同
    回复