picker组件,基础库 2.24.1.
当四联时,第三列内容相同时,第三列,第四列滑动后,再滑动第二列,第四列不会归 0。
可以解决,但是我感觉是BUG。
解决方法:单独setData pickerIdx和curVal这个错误可以解决,set的顺序不可以调换。
不知道还有什么别的方法解决吗?请回复!!!因为我的数据相同的项还挺多的。很不方便。
下面是错误和解决的源码:
// .wxml
<picker mode="multiSelector" value="{{pickerIdx}}" range="{{curVal}}" bindcolumnchange="columnChange">123</picker>
// .js
Page({
data: {
pickerVal: {
colOne: ['1', '2', '3'],
colTwo: [['11', '12'], ['21', '22'], ['31', '32'],],
// colThree: [[['111', '112'], ['121', '122'],], [['211', '212'], ['221', '222'],], [['311', '312'], ['321', '322'],],], // 可以正常归 0
colThree: [[['111', '111'], ['111', '111'],], [['111', '111'], ['221', '222'],], [['311', '312'], ['321', '322'],],], // 错误1,不可以正常归 0
colFour: [
[[['1111', '1112'], ['1121', '1122'],], [['1211', '1212'], ['1221', '1222'],]],
[[['2111', '2112'], ['2121', '2122'],], [['2211', '2212'], ['2221', '2222'],]],
[[['3111', '3112'], ['3121', '3122'],], [['3211', '3212'], ['3221', '3222'],]],
]
},
pickerIdx: [0, 0, 0, 0],
curVal: []
},
onReady() {
let { pickerVal, pickerIdx } = this.data;
this.setData({
curVal: [
pickerVal.colOne,
pickerVal.colTwo[pickerIdx[1]],
pickerVal.colThree[pickerIdx[1]][pickerIdx[2]],
pickerVal.colFour[pickerIdx[1]][pickerIdx[2]][pickerIdx[3]]
]
});
},
columnChange(event) {
let { pickerVal, pickerIdx, curVal } = this.data, { column, value } = event.detail;
pickerIdx[column] = value;
switch (column) {
case 0:
pickerIdx[1] = 0;
pickerIdx[2] = 0;
pickerIdx[3] = 0;
break;
case 1:
pickerIdx[2] = 0;
pickerIdx[3] = 0;
break;
case 2:
pickerIdx[3] = 0;
break;
};
curVal[1] = pickerVal.colTwo[pickerIdx[0]];
curVal[2] = pickerVal.colThree[pickerIdx[0]][pickerIdx[1]];
curVal[3] = pickerVal.colFour[pickerIdx[0]][pickerIdx[1]][pickerIdx[2]];
this.setData({ curVal, pickerIdx }); // 错误1时,使用这个就会不归 0
// this.setData({ pickerIdx }); // 使用单独setData就可以正常显示
// this.setData({ curVal });
},
/**
* 有几种错误情况
* 1、当四联时,第三列有相同内容时,第三列,第四列滑动后,再滑动第二列,第四列不会归 0。
* 2、如果单独setData pickerIdx和curVal这个错误可以解决,set的顺序不可以调换。
*/
})