下面來介紹小picker，分三種樣式：
預設的自己可以定義資料的
mode="time"是時間選擇器
mode="date"是日期選擇器
跟其他的一樣先來看下picker.wxml
picker
選擇器地區選擇器
當前選擇：}
時間選擇器
當前選擇: }
日期選擇器
當前選擇: }
picker.wxss
page {
background-color: #fbf9fe;
height: 100%;
.page__hd{
padding: 50rpx 50rpx 100rpx 50rpx;
text-align: center;
.page__title{
display: inline-block;
padding: 20rpx 40rpx;
font-size: 32rpx;
color: #aaaaaa;
border-bottom: 1px solid #cccccc;
.page__desc{
display: none;
margin-top: 20rpx;
font-size: 26rpx;
color: #bbbbbb;
.section{
margin-bottom: 80rpx;
.section__title{
margin-bottom: 16rpx;
padding-left: 30rpx;
padding-right: 30rpx;
.picker{
padding: 26rpx;
background-color: #ffffff;
picker.js
page({
data: {
array: ['中國', '美國', '巴西', '日本'],
index: 0,
date: '2016-09-01',
time: '12:01'
bindpickerchange: function(e) {
console.log('picker傳送選擇改變，攜帶值為', e.detail.value)
this.setdata({
index: e.detail.value
binddatechange: function(e) {
this.setdata({
date: e.detail.value
bindtimechange: function(e) {
this.setdata({
time: e.detail.value
demo位址
下面是頁面展示
展示.png
三種樣式圖：
1. 預設的自己可以定義資料的
1.png
2. mode="time"是時間選擇器
2.png
3. mode="date"是日期選擇器
3.png
微信小程式 picker
本文章主要解釋乙個mode為selector，平常比較常用的一些固定的選擇，我們平常就這樣子寫了，picker bindchange bindcaspickerchangestatusemployee value range name employeestatus text 在職資訊 text te...
微信小程式自定義picker
使用姿勢 獲取 尾巴之前ui丟了一張類似這樣的效果圖 當然這個是本文的效果圖，不是原圖，不過差不多 給我 當時看到圖就想這個還不簡單，直接使用picker就行了。然後就是一頓操作，選擇mode為date，最終出現了效果圖 正當我沉浸在完成功能的喜悅中的時候，心裡有個聲音一直在提醒我 你沒有達到ui需...
微信小程式 聯動選擇器picker
從底部彈起的滾動選擇器，現支援五種選擇器，通過mode來區分，分別是普通選擇器，多列選擇器，時間選擇器，日期選擇器，省市區選擇器，預設是普通選擇器。先來看看效果圖 普通選擇器 view range view class picker one 當前的選擇 view picker html view p...