微信小程序切图 wx:for循环以及点击事件

2020年12月23日

微信小程序切图 wx:for循环以及点击事件

来自官方的代码演示，很直观易懂

打开微信开发者文档，在框架部分的视图层–》wxml–》列表渲染中可以看到官方给出的for循环实例，在实例中可以看到下面相关说明。

默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item；使用 wx:for-item 可以指定数组当前元素的变量名，使用 wx:for-index 可以指定数组当前下标的变量名。

test.wxml

<view wx:for=”{{array}}”>
{{index}}: {{item.message}}
</view>
<view wx:for=”{{array}}” wx:for-index=”idx” wx:for-item=”itemName”>
{{idx}}: {{itemName.message}}
</view>

test.js

Page({
data: {
array: [
{message: ‘foo’,},
{message: ‘bar’}
]
}
})

来自切图网项目的代码片段

js代码

data: {

//普通选择器
array: [‘查看客人手机号码’,’开单’, ‘收银’, ‘收银’, ‘查看门店业绩数据’,’同步启用管理端’],
arrayindex: 0,//默认显示位置

},
tap:function(e){
var current=e.currentTarget.dataset.current;//获取到绑定的数据
//改变menuTapCurrent的值为当前选中的menu所绑定的数据
this.setData({
arrayindex:current
});

本文由专业的WEB前端外包公司-切图网原创，转载请保留版权（ WEB前端开发外包www.qietu.com ）切图网始于2007年，提供高品质的前端开发服务、前端外包、切图外包。欢迎来电咨询！热线：027-81777732、13343477732

标签：切图, 微信小程序

2020年12月23日