小程序picker的使用

效果图:

代码:

<view class='infoItem'>
    <view class='infoItem-left'><text style='color:red'>*</text>出厂时间</view>
    <view class='infoItem-right'>
      <picker mode="date" start="1900-01-01" end="{{currentTime}}" value="{{deliveryTime}}" bindchange="bindDateChange">
        <view style='color:#666;padding:10rpx 0 10rpx 20rpx'>{{deliveryTime}}</view>
      </picker>
    </view>
  </view>
.infoItem{
  display: flex;
  border-bottom:2rpx solid #f2f2f2;
  padding:10rpx 0;
}
.infoItem-left{
   220rpx;
  padding: 10rpx 0
}
.infoItem-right{
  flex: 1;
  background: #f2f2f2;
  border-radius: 10rpx;
  font-size: 30rpx
}
.infoItem-right>input{
  padding:10rpx 0 10rpx 20rpx;
  color: #666
}
const app = getApp()
var timestamp = Date.parse(new Date());
var date = new Date(timestamp);
//获取年份  
var Y = date.getFullYear();
//获取月份  
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
//获取当日日期 
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
var currentTime = Y + '-' + M + '-' + D

Page({

  /**
   * 页面的初始数据
   */
  data: {
    currentTime, //不能超过当前时间
    deliveryTime: '请选择',//出厂时间 date
    
  },
/**
   * 出厂时间
   */
  bindDateChange(e) {
    this.setData({
      deliveryTime: e.detail.value
    })
    console.log(e.detail.value)
  },

}
原文地址:https://www.cnblogs.com/520BigBear/p/11236260.html