小程序普通选择器的创建详解（我的成长之路_No.2）

在如何创建小程序令自己满意的选择器上让自己从0开始学了很多知识；

根据官方文档的解析：

1.需要先创建一个数组用来承载你的选择器中option的内容（当然小程序中是没有select和option标签的，而是用picker标签进行代替【当然常规来讲选择器接收的值需要用text标签进行接收，如：<text>{{obj}}</text>】）

-------------------------------以下为后端代码------------------------------------------
selectArry：[
    {
        value:'1'
        name:'张三'
    },
    {
        value:'2'
        name:'张四'
    },
    {
        value:'3'
        name:'张五'
    },
]
selectArryIndex:0,//初始值下标 非常重要 下标从0开始 与设定的value无关

-------------------------------以下为前端代码------------------------------------------

<picker bindchange="bindPickerChange" name="transaction"  value="{{selectArryIndex}}" range="{{selectArry}}" range-key="name">
            <view class="picker">
                <text>{{selectArry[selectArryIndex].name}}</text>
            </view>
 </picker>//如果需要获取选择器当前选择的值进行判断的话 需要将name写在 picker标签中

2.创建选择器对应事件，才能进行相关的赋值工作

 //选择器修改
    bindPickerChange:function (e) {
        var that = this;
        that.setData({
            selectArryIndex:e.detail.value,
        })
    },

 3.特别需要注意的一点mode为选择器类型（小程序中有很多种选择器哦）{

selector	普通选择器//默认选择器类型
multiSelector	多列选择器
time	时间选择器
date	日期选择器
region	省市区选择器

}

range	array/object array	[]	mode 为 selector 或 multiSelector 时，range 有效
range-key	string		当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容
value	number	0	表示选择了 range 中的第几个（下标从 0 开始）
bindchange	eventhandle		value 改变时触发 change 事件，event.detail = {value}

坑：当range为对象数组存在时，必须range-key指定当前页面显示规则，否则显示的内容均为objsele例如以上代码。

4.选择器判断

var PayMentType = e.detail.value.PayMentType;//获取选择器下标

 if (PayMentType == '0') {//判断
            wx.showToast({
              title: '请选择类型',
              icon:'none',
              duration:2000
            })
            return
  }