WXOPEN Club

动态生成 Picker 如何独立选择器

发布于 6 年前作者 chenqiang11136 次浏览最后编辑 6 年前来自 ask
  • 需求的场景描述（希望解决的问题）

通过 view  - wx:for    动态生成多个(具体数量不明)Picker

它们的选项都是固定的

— 我现阶段做法是根据文档 使用 如下的方式

<picker bindchange=“bindPickerChange” value=“{{index}}” range=“{{array}}”>

<view class=“picker”>

当前选择：{{array[index]}}

<view>

<picker>

但是 我希望 每个 picker 都相互独立  比如第一个选择器 选引索 0    第二个选引索 3 ------

  • 希望提供的能力

我希望 每个 picker 都相互独立  比如第一个选择器 选引索 0    第二个选引索 3

然后在*.js中能针对某一个得到选择值…

现在想到的办法是 通过 e.currentTarget.id 去取出标签的id  然后 通过 hashmap 保存起来

但是又出现新的问题了…

保存了之后 如何控制页面的 picker 切换选项呢   (如果这里更改 index的话 所有的picker都改变了.这里要求只更改选择的哪一个)

1 回复
rma
rma1 楼4 年前

搞定了  换了一种思路

全部用map存起来就行了 附上代码

WXML:

<view wx:for=“{{bitems}}” wx:key=“id”>

<view>ID:{{bitems[index].D_Index}} 设备码:<font class=“Device_Code”>{{bitems[index].D_Code}}</font></view>

<view>名称:

<picker id=“{{index}}” bindchange=“bindPickerChange” value=“{{index}}” range=“{{array}}”>

<view class=“picker”>

当前选择：{{array[Aindex[index].ConIndex]}}

</view>

</picker>

</view>

</view>

JS:

array: [‘美国’, ‘中国’, ‘巴西’, ‘日本’],

objectArray: [

{

id: 0,

name: ‘美国’

},

{

id: 1,

name: ‘中国’

},

{

id: 2,

name: ‘巴西’

},

{

id: 3,

name: ‘日本’

}

],

Aindex: null

var strCou =“[”;

for (var cou in it)

{

strCou = strCou + “{\“ConIndex\”:\“0\”},”;

}

strCou = strCou.slice(0,strCou.length-1);

strCou = strCou+“]”;

console.log(“strCou :” + strCou);

var Alist = JSON.parse(strCou);

that.setData({ Aindex: Alist});

bindPickerChange: function (e) {

var that = this;

var id = e.target.id;

var inds = that.data.Aindex;

inds[id].ConIndex = e.detail.value;

that.setData({ Aindex: inds });

}