uview-plus中的picker组件用法

在uView Plus中，picker组件是一种常用的UI组件，用于用户在多个选项中选择一个选项。它支持多种选择模式，如单列模式、多列模式、时间选择器等。以下是picker组件的基本用法：

1. 单列模式

<uni-picker mode="selector" :range="{{['选项1','选项2','选项3']}}" @confirm="onPickerConfirm">
  <view>请选择</view>
</uni-picker>

在单列模式中，我们通过设置mode属性为"selector"来指定选择器的模式。同时，通过设置range属性来指定选项列表。在用户选择完选项并点击确定按钮后，会触发confirm事件，我们可以在事件处理函数中获取选中的值。

2. 多列模式

<uni-picker mode="multiSelector" :range="{{multiRange}}" @confirm="onPickerConfirm">
  <view>请选择</view>
</uni-picker>

在多列模式中，我们通过设置mode属性为"multiSelector"来指定选择器的模式。同时，通过设置range属性来指定多列选项列表。我们需要将每列选项列表保存在一个数组中，然后将这些数组组成一个数组，作为range属性的值。在用户选择完选项并点击确定按钮后，会触发confirm事件，我们可以在事件处理函数中获取选中的值。此外，我们还需要在data中定义一个multiIndex变量来保存每列选中的索引值。

3. 时间选择器

<uni-picker mode="time" @confirm="onPickerConfirm">
  <view>请选择时间</view>
</uni-picker>

在时间选择器中，我们通过设置mode属性为"time"来指定选择器的模式。在用户选择完时间并点击确定按钮后，会触发confirm事件，我们可以在事件处理函数中获取选中的时间值。

在以上示例代码中，我们都绑定了confirm事件，然后在事件处理函数中获取选中的值。我们可以根据实际需求来选择合适的模式和设置选项，以满足我们的业务需求。