picker小程序picker组件里面同时有几个选择器怎么设置才能不相互影响

记录下自己使用picker组件遇到的一些小问题,以及自己使用的解决方法,

这个方法应该不是唯一,大家有更好的方法也可以提出来一起参考下。

如果有多个选择器的话,而且没有改相应的一直参数,当你选择第一个选择器的第n个值的时候

就会同时控制另外一个选择器的第n个值被选中,这就不能被我们正常使用了,下面说下要改的参数:

红色的是修改的,具体每个对应什么,大家看一下官方文档picker组件就清楚了。

wxml:


<!--部门选择 -->
< view class= "section department-select" >
< picker bindchange = " bindPickerChange1 " value = "{{ bindex }}" range = "{{ departmentArray }}" >
< view class= "picker" >
{{ departmentArray[bindex] }}
</ view >
</ picker >
</ view >

<!--身份选择 -->
< view class= "section identity-select" >
< picker bindchange= "bindPickerChange" value= "{{index}}" range= "{{array}}" >
< view class= "picker" >
{{array[index]}}日报
</ view >
</ picker >
</ view >


js:


data : {
array : [ '夏彤' , '陈学华' , '甘广' , '黄龙流' , '李昌略' , '董俊辉' , '罗景盛' , '钟敏君' , '林锐' , '麦健发' , '曹兵' ],
objectArray : [
{
id : 0 ,
name : '夏彤'
},
{
id : 1 ,
name : '陈学华'
},
{
id : 2 ,
name : '甘广'
},
index:0,
departmentArray : [ '营销三部' , '营销一部' , '营销二部' , '营销四部' ],
objectdepartmentArray : [
{
id : 0 ,
name : '营销三部'
},
{
id : 1 ,
name : '营销一部'
},
{
id : 2 ,
name : '营销二部'
},
{
id : 3 ,
name : '营销四部'
}
],
bindex : 0 ,

bindPickerChange : function (e ) {
console .log ( 'picker发送选择改变,携带值为' , this .data .array [e .detail .value ])
this .setData ({
index : e .detail .value
})
},
bindPickerChange1 : function ( e ) {
console . log ( 'picker发送选择改变,携带值为' , this . data . departmentArray [ e . detail . value ])
this .setData ({
bindex : e . detail . value
})

},





<!--身份选择 -->
< view class= "section identity-select" >
< picker bindchange= "bindPickerChange" value= "{{index}}" range= "{{array}}" >
< view class= "picker" >
{{array[index]}}日报
</ view >
</ picker >
</ view >

猜你喜欢

转载自blog.csdn.net/weixin_39818813/article/details/80548931