微信小程序picker样式的写法

微信小程序的 picker 组件有两种样式：普通 picker 和时间选择器 picker。

1. 普通 picker 样式的写法

在 wxml 文件中，可以这样写：

<view class="picker-wrapper">
  <picker mode="selector" range="{{array}}" value="{{index}}" bindchange="bindPickerChange">
    <view class="picker">
      {{array[index]}}
    </view>
  </picker>
</view>

其中，`.picker-wrapper` 是 picker 的容器，`.picker` 是 picker 的样式。

在 wxss 文件中，可以这样写：

.picker-wrapper {
  width: 100%;
  height: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.picker {
  width: 100%;
  height: 100%;
  font-size: 28rpx;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
}

其中，`.picker-wrapper` 和 `.picker` 分别对应 wxml 中的类名。

2. 时间选择器 picker 样式的写法

在 wxml 文件中，可以这样写：

<view class="picker-wrapper">
  <picker mode="time" value="{{time}}" start="{{startTime}}" end="{{endTime}}" bindchange="bindTimeChange">
    <view class="picker">
      {{time}}
    </view>
  </picker>
</view>

其中，`.picker-wrapper` 是 picker 的容器，`.picker` 是 picker 的样式。

在 wxss 文件中，可以这样写：

.picker-wrapper {
  width: 100%;
  height: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.picker {
  width: 100%;
  height: 100%;
  font-size: 28rpx;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
}

其中，`.picker-wrapper` 和 `.picker` 分别对应 wxml 中的类名。

以上是两种 picker 样式的写法，可以根据实际需求进行样式的修改。