今天完成的事情：完成了小程序的页面

明天计划的事情：完成逻辑层

收获：

picker组件的用法

picker组件时一个从底部弹起的可滚动的选择器，支持5种选择器 ：

普通选择器、多列、时间、日期和省市区 ， 通过mode区分 ， 默认是普通选择器 (分别对应的mode值为selector，multiSelector，time,date和region)

例如 ：

<picker mode='selector' ></picker >

一个普通的选择器：

 <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">

    <view class="picker">

      当前选择：{{array[index]}}

    </view>

  </picker>

bindchange 是value改变时触发的事件 ， 通过event.detail.value获取当前列表索引

value value 的值表示选择了 range 中的第几个（下标从 0 开始）

range 绑定的是一个数组类型的数据

选择器触发事件

bindPickerChange: function(e) {

    console.log('picker发送选择改变，携带值为', e.detail.value)

    this.setData({

      index: e.detail.value

    })

  }

需要在data中定义一个数组和下标

data:{

array: ['1', '2', '3', '4'],

index:0

}