实现点击添加多条信息,且信息其中一个字段为picker下拉字段
//wxml文件
<block wx:for="{{lists}}" wx:key="{{index}}" >
<view class="xx">
<view>
<picker bindchange="bindtest1" data-id="{{index}}" value="{{hosList[index_test1].id}}" range="{{hosList}}" range-key="{{'name'}}" data-selecthx="{{hosList[index_test1].name}}">
<view >
<text decode="{{true}}" value="{{lists[index][3]}}">产品信息{{index}}: {{lists[index][3]}}</text>
</view>
</picker>
</view>
</view>
<input class='create-li' data-id="{{index}}" value='{{lists[index][0]}}' placeholder="选项1" bindinput='bindKeyInput'></input>
<input class='create-li' data-id="{{index}}" value='{{lists[index][1]}}' placeholder="选项2" bindinput='bindKeyInput2'></input>
</block>
<button class='add-li' bindtap='addList'>添加选项</button>
<button class='add-li' bindtap='delList'>删除选项</button>
js代码
bindKeyInput: function(e) {
var that = this;
var index = e.currentTarget.dataset.id; //使用event.currentTarget.dataset.XX获取内容
that.setData({
text: e.detail.value
})
that.data.lists[index][0] = that.data.text;
console.log("index1", index);
console.log("value1", that.data.lists[index][0]);
},
bindKeyInput2: function(e) {
var that = this;
var index2 = e.currentTarget.dataset.id; //使用event.currentTarget.dataset.XX获取内容
that.setData({
text: e.detail.value
})
that.data.lists[index2][1] = that.data.text;
console.log("index2", index2);
console.log("value2", that.data.lists[index2][1]);
},
bindtest1(e) {
var that = this;
var index3 = e.currentTarget.dataset.id;
that.setData({
index_test1: e.detail.value,
depid: that.data.hosList[e.detail.value].id,
depname: that.data.hosList[e.detail.value].name,
[`lists[${index3}][2]`]: that.data.hosList[e.detail.value].id,
[`lists[${index3}][3]`]: that.data.hosList[e.detail.value].name,
})
// that.data.lists[index3][2] = that.data.depid;
// that.data.lists[index3][3] = that.data.depname;
console.log("---------------------------------------");
console.log("0.index3", index3);
console.log("1.index_test1", e.detail.value);
console.log("2.depid", that.data.depid);
console.log("3.name", that.data.depname);
console.log("4.that.data.lists[index3][2]", that.data.lists[index3][2]);
console.log("5.that.data.lists[index3][3]", that.data.lists[index3][3]);
console.log("6,list",that.data.lists)
},
即可实现点击添加选项,选项字段可输入可下拉选择。