小程序運用picker來做日期選擇器

存個模板方便以后復制粘貼www

效果圖：

 

wxml：

<picker class="toast_date" mode="date" value="{{date}}" start="" end="" bindchange="date_change">
    <button type="default">{{date}}</button>
</picker>

wxss：

.toast_date button{
  border-radius: 30px;
  color: #ff9999;
  background-color: white;
}

js：

var util = require('../../utils/utils.js')
var now_date = util.formatDate(new Date())

data: {
    date: now_date
},

date_change: function(e) {
    this.setData({
        date: e.detail.value
    })
},

util.js

function formatTime(date) {  
  var year = date.getFullYear()  
  var month = date.getMonth() + 1  
  var day = date.getDate()  
  
  var hour = date.getHours()  
  var minute = date.getMinutes()  
  var second = date.getSeconds()  
  
  return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')  
}  

function formatDate(date) {  
  var year = date.getFullYear()  
  var month = date.getMonth() + 1  
  var day = date.getDate()  
  
  return [year, month, day].map(formatNumber).join('-')
}
  
function formatNumber(n) {  
  n = n.toString()  
  return n[1] ? n : '0' + n  
}  
  
module.exports = {  
  formatTime: formatTime,
  formatDate: formatDate
}