uniapp 多列picker选择
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/f16e80e7fa194513ba4f40d09ee3e603.png#pic_center)
代码块
<template>
<view>
<h1>多列选择</h1>
<p>请选择</p>
<picker :range="Arrays" @change="ArraysChange" mode="multiSelector">
{{ Arrays[0][optionsIndex1] }} 年 {{ Arrays[1][optionsIndex2] }} 月 {{ Arrays[2][optionsIndex3] }} 日
</picker>
</view>
</template>
<script>
export default {
data() {
return {
Arrays: [
[2022, 2023, 2024, 2025],
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13],
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27,
28, 29, 30
]
],
optionsIndex1: 0,
optionsIndex2: 0,
optionsIndex3: 0,
}
},
methods: {
ArraysChange: function(e) {
console.log(e)
this.optionsIndex1 = e.detail.value[0];
this.optionsIndex2 = e.detail.value[1];
this.optionsIndex3 = e.detail.value[2];
}
}
}
</script>
<style>
</style>