E企盈营销工具技术服务商 热线:4006-838-530

picker,微信小程序通过picker获取选中的值

E企盈直播平台营销卖货系统

有源码微信小程序的picker类型很多,时间获取比较好获取,直接e.detail.value就可以获取,但是像很多是类别的获取,这样就很难获取了,因为你的e.detail.value获取到的是数组的下标,这样你无法获取你想要的数据,这样就导致无法和后台交互,下面我用一个具体的实例来讲一picker获取数组的数据:做的就是车位预约申请:第一个问题:选中数据但是无法再前段显示选中的数据(一定得加objectArray)data:{array:[‘标间:168′,’大床房:198′,’商务房:268′,’总统套房:368′,’三人间:208′,’vip套房:108′],objectArray:[{id:0,name:’标间:168′},{id:1,name:’大床房:198′},{id:2,name:’商务房:268′},{id:3,name:’总统套房:368′},{id:4,name:’三人间:208′},{id:5,name:’vip套房:108’}],index:0,然后通过setdata给前段返回获取的下标booktype:function(e){console.log(e.detail.value)this.setData({index:e.detail.value})console.log(this.data.array[e.detail.value])},这样就可以将选中的数据在前段显示了第二个问题就是:获取的是下标,我们想要数组的数据,这时候你e.detail.value没有什么用。你要注意到你的数组在data里边,所以你需要data.array[e.detail.value],本以为这样就成功了,但是这是js语言,data无法直接获取,需要用this获取上一层对象(不理解的话看一下js语言吧),这样就可以直接获取了this.data.array[e.detail.value]现在就可以拿到你的数据了。最后我分享一下完整的代码:wxmlviewbutton车位申请/buttontext/texttext车位号选择/textviewpickerbindchange=”booktype”value=”{{index}}”range=”{{array}}”viewbindchange=”bindDateChange5″车位号:{{array[index]}}/view/picker/viewtext/texttext使用开始时间/textviewviewimagesrc=”../../image/date.png”/imagepickermode=”date”placeholder=”选择日期”value=”{{date}}”start=”2019-06-06″end=”2019-09-01″bindchange=”bindDateChange”view{{date}}/view/picker/viewviewimagesrc=”../../image/time.png”/imagepickermode=”time”placeholder=”选择时间”value=”{{time}}”start=”01:00″end=”24:00″bindchange=”bindTimeChange”view{{time}}/view/picker/view/viewtext使用结束时间/textviewviewimagesrc=”../../image/date.png”/imagepickermode=”date”placeholder=”选择日期”value=”{{date1}}”start=”2019-06-06″end=”2019-09-01″bindchange=”bindDateChange1″view{{date1}}/view/picker/viewviewimagesrc=”../../image/time.png”/imagepickermode=”time”placeholder1=”选择时间”value=”{{time1}}”start=”01:00″end=”24:00″bindchange=”bindTimeChange1″view{{time1}}/view/picker/view/viewbuttonbindtap=”apply”申请/button/viewwxcssa.container{background:#fff;}.ar_coverpath{width:100%;margin:0rpx;padding:0rpx;height:175px;}.ar_coverpathimage{width:100%;}.ar_picker{width:100%;font-size:30rpx;color:#000;background:#efeff4;margin:0;}.ar_picker.ar_picker_wrap{width:670rpx;background:#fffurl(../../images/arrow.png)no-repeatrightcenter;background-size:25rpx14rpx;background-position:650rpx;border-radius:20rpx;padding:20rpx;margin:20rpxauto;}.ar_cont{padding:20rpx60rpx;font-size:30rpx;background:#fff;margin-bottom:40rpx;line-height:45rpx;color:#666666;}.ar_cont.ar_cont_h1{font-size:32rpx;font-weight:600;line-height:30rpx;color:#000;}.ar_date_time{width:100%;display:flex;flex-direction:row;justify-content:space-between;margin:10rpx0rpx60rpx;}.ar_date_time.ar_date,.ar_date_time.ar_time{width:47%;display:flex;flex-direction:row;justify-content:space-around;}.ar_date_time.ar_dateimage{width:34rpx;height:38rpx;}.ar_date_time.ar_timeimage{width:45rpx;height:38rpx;}.ar_date_timepicker{width:220rpx;border:1pxsolid#ddd;border-radius:8rpx;padding:0rpx10rpx;margin-left:10rpx;}.input_msg{border:1pxsolid#ddd;border-radius:10rpx;padding:0rpx10rpx;height:40px}.ar_book{background:#4a90d2fd;font-size:32rpx;color:#fff;border-radius:0rpx;margin:40rpx0rpx10rpx;}/pages/book/book.wxss/wxjsPage({data:{array:[‘标间:168′,’大床房:198′,’商务房:268′,’总统套房:368′,’三人间:208′,’vip套房:108′],objectArray:[{id:0,name:’标间:168′},{id:1,name:’大床房:198′},{id:2,name:’商务房:268′},{id:3,name:’总统套房:368′},{id:4,name:’三人间:208′},{id:5,name:’vip套房:108′}],index:0,//addrArray:util.replacePhone(mydata.userData().addrs,true),addrIndex:0,date:’2019-7-1′,time:’12:00′,date1:’2019-7-1′,time1:’12:00’,bookToastHidden:true,},booktype:function(e){console.log(e.detail.value)this.setData({index:e.detail.value})console.log(this.data.array[e.detail.value])},//日期选择bindDateChange:function(e){console.log(‘datepicker发送选择改变,携带值为’,e.detail.value)wx.setStorageSync(“begtime”,e.detail.value)this.setData({date:e.detail.value})},//时间选择bindTimeChange:function(e){//app.globalData.date1=e.detail.valueconsole.log(‘timepicker发送选择改变,携带值为’,e.detail.value)wx.setStorageSync(“begtime1”,e.detail.value)this.setData({time:e.detail.value})},//日期选择bindDateChange1:function(e){console.log(‘datepicker发送选择改变,携带值为’,e.detail.value)wx.setStorageSync(“begtime2”,e.detail.value)this.setData({date1:e.detail.value})},//时间选择bindTimeChange1:function(e){//app.globalData.date1=e.detail.valueconsole.log(‘timepicker发送选择改变,携带值为’,e.detail.value)wx.setStorageSync(“begtime3”,e.detail.value)this.setData({time1:e.detail.value})},aquery:function(e){varclassid=e.detail.valuewx.setStorageSync(“classid”,classid)},aquery1:function(e){varcount=e.detail.valuewx.setStorageSync(“count”,count)},aquery2:function(e){varapplypeo=e.detail.valuewx.setStorageSync(“applypeo”,applypeo)},apply:function(){varapplypeo=wx.getStorageSync(“applypeo”)varbegtime=wx.getStorageSync(“begtime”)varbegtime1=wx.getStorageSync(“begtime1”)varbegtime2=wx.getStorageSync(“begtime2”)varbegtime3=wx.getStorageSync(“begtime3″)varbegtime4=begtime+””+begtime1varendtime=begtime2+””+begtime3console.log(begtime4,endtime)wx.request({url:’http://localhost:8080/lg/classroomController/wxaddapplyclassroom’,data:{applypeo:applypeo,begtime:begtime4,endtime:endtime},success:function(res){varmess=res.data.messif(mess===”成功”){wx.showModal({title:’提示’,content:’申请已提交’,})}else{wx.showModal({title:’提示’,content:’申请失败’,})}}})}})承接毕业设计:微信小程序、ssm和树莓派硬件有开发好的毕业设计可直接购买,价格便宜。扫描下面二维码加微信(非诚勿扰):

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » picker,微信小程序通过picker获取选中的值
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏