微信小程序学习笔记（十二）picker

mode 选择器类别  selector为普通选择器  
bindchange是监听事件 点击确定时触发
bindcancel也是监听事件 点击取消时触发

普通选择器

    {{array[index]}}

Page({
  data: {
    array:['zn','usa','hk'],
    index:0
  }, commonSelected: function (e) {
    //改变index值，通过setData()方法重绘界面
    this.setData({
      index: e.detail.value
    });
  },commonCancel:function(){
	  console.log('我取消了！');
  }
 
})

value 是默认选中的值
只能选择start->end之间的时间
bindchange监听事件

  日期选择器
  
    
      当前选择: {{date}}

    
  

获取当前时间

在utils/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('-') 
}

function formatNumber(n) {
  n = n.toString()
  return n[1] ? n : '0' + n
}

module.exports = {
  formatTime: formatTime
}  

var util = require('../../utils/util.js'); 

onLoad:function(){
     var time = util.formatTime(new Date());  
    // 再通过setData更改Page()里面的data，动态更新页面的数据  
    this.setData({  
      date: date  
    }); 
  },
  bindDateChange: function(e) {
      //调用setData()重新绘制
      this.setData({
          date: e.detail.value,
      });
  }

省市选择器

custom-item是自定义选项于每一列的顶部

  省市区选择器
  
    
      当前选择：{{region[0]}}，{{region[1]}}，{{region[2]}}
    
  

  bindRegionChange: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      region: e.detail.value
    })
  }

时间选择器

  时间选择器
  
    
      当前选择: {{time}}