关于前端的简单数据交互处理
2020-07-09 本文已影响0人
在下高姓
后端的数据格式:
extend: {位置: ["打野","上单","法师","AD","辅助"], 可接大区: ["微信", "QQ"]}
html:这是一个小程序的滑动选择器
<view wx:for="{{extend}}" wx:key="item">
<view>{{index}}</view>
<view class="right2">
<!-- 滑动选项开关 -->
<picker bindchange="bindPickerChangeA" data-inx="{{index}}" value="{{index}}" range="{{item}}">
{{item[indexA[index]]}}
</picker>
<image src="/pages/static/img/right.png"></image>
</view>
</view>
js:
onLoad: function (options) {生命周期加载数据并处理
let data2={
id:options.gameID
}
app.GR('GET','api/game/get_one_game',data2,function(res){//调用封装的公用请求
that.setData({
extend:res.data.data.extend
})
let indexA={};
for(let i in res.data.data.extend){//初始化赋值处理
indexA[i]=0
}
that.setData({
indexA:indexA
})
})
}
//滑动选择
bindPickerChangeA: function(e) {
let index1=e.currentTarget.dataset.inx;//数组extend的下标---文字
let index2=e.detail.value;//数组extend下标对应数组选取的index
let arr=this.data.arr;
arr[index1]=this.data.extend[index1][index2]//获取所有选择的数据
let index_0=this.data.indexA;//选择的下标集合
index_0[index1]=index2//集合对应下标赋值
this.setData({
indexA: index_0//重新赋值
})
},