uni-app 之 picker选择器

uni-app 之 picker选择器

同步滚动：开

uni-app 之 picker选择器

一、普通选择器
二、多列选择器
三、时间选择器
四、日期选择器

一、普通选择器

<template>
    <view>
        <picker @change="bindPickerChange" :value="index" :range="array" range-key="name">
            <view style="padding: 20rpx;background-color: white;">{
  { array[index].name }}</view>
        </picker>
    </view>
</template>
<script>
export default {
    data() {
        return {
            array: [{ name: '中国' }, { name: '美国' }, { name: '巴西' }, { name: '日本' }],
            index: 2,
        };
    },
    methods: {
        bindPickerChange: function(e) {
            this.index = e.detail.value;
        }
    }
};
</script>

二、多列选择器

<template>
    <view>
        <picker mode="multiSelector" @columnchange