一、wxml中代码
<view class="in_order_Param">
<text>状态：</text>
<picker mode="selector" bindchange="bindPickerChange" value="{{listQuery.status}}" range="{{array}}">
<input placeholder="状态" name="status" value="{{name}}" bindinput="handleinput" data-name="status" style="width: 90%"/>
</picker>
</view>
mode值为selector，即普通模式。注意:选择某一项后，提交的是索引，即listQuery.status为索引值，为数值。选择后触发change事件。
二、js中的代码
data: {
listQuery: {
page: 1, // 页码
limit: 5, // 个数
},
array: [\'新建\', \'已发货\', \'已收货\', \'退货\',\'已入库\',\'已备货\',\'已确认\',\'部分退货\',\'已作废\'], // 0.新建1.已发货2.已收货3.退货4.已入库5.已备货6.已确认7.部分退货9.已作废
name: \'\'
},
onLoad: function () {
this.getSupplyNoteList(true);
},
getSupplyNoteList: function(isRefresh){
var that = this;
console.log(that.data.listQuery);
request.postParam("/api/supply/list",that.data.listQuery,function(res){
wx.hideLoading();
console.log(res)
。。。。。省略。。。。。
});
},
bindPickerChange: function(e) {
// console.log(e);
this.setData({
name: this.data.array[e.detail.value],
\'listQuery.status\': e.detail.value == 8 ? (parseInt(e.detail.value) + 1) : e.detail.value
})
console.log(\'picker发送选择改变，显示值为\', this.data.listQuery.status)
},
触发change事件后调用bindPickerChange方法，方法中将e中传递过来的索引值转换为状态对应的中文，这样页面就显示出了状态的中文。同时修改listQuery.status的值，因为状态“已作废”的索引不是8，而是9，所以需要经过处理，然后再发起请求。
页面效果如下：
请发表评论