【小程序】微信小程序button官方示例代码中按钮响应函数问题

【小程序】微信小程序button官方示例代码中按钮响应函数问题

先贴代码再说明问题
//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]是什么意思？？？？？？

回答

for (var i = 0; i < types.length; ++i) {
  (function (type) {
  )(types[i]);
  console.log('types[i]=' + types[i])
}
这样看是不是爽多了？
这样不就等于形成了一个闭包。把i这个值存了下来？

以上是 【小程序】微信小程序button官方示例代码中按钮响应函数问题 的全部内容， 来源链接： utcz.com/a/83861.html

回到顶部