微信小程序 （十八）picker组件详细介绍

微信小程序 （十八）picker组件详细介绍

picker选择器分为三种，普通选择器，时间选择器， 日期选择器 用mode属性区分，默认是普通选择器。测试时时间和日期点击无反应不知道是BUG还是啥！没法手机测试现在也不知道咋回事！！

主要属性：

普通选择器

时间选择器

日期选择器

wxml

普通选择器

{{array[index]}}

时间选择器

{{time}}

日期选择器

{{date}}

js

Page({

data:{

// text:"这是一个页面"

array: ['android', 'IOS', 'ReactNativ', 'WeChat', 'Web'],

index: 0,

time: '08:30',

date: '2016-09-26'

},

/**

* 监听普通picker选择器

*/

listenerPickerSelected: function(e) {

//改变index值，通过setData()方法重绘界面

this.setData({

index: e.detail.value

});

},

/**

* 监听时间picker选择器

*/

listenerTimePickerSelected: function(e) {

//调用setData()重新绘制

this.setData({

time: e.detail.value,

});

},

/**

* 监听日期picker选择器

*/

listenerDatePickerSelected:function(e) {

this.setDate({

date: e.detail.value

})

},

onLoad:function(options){

// 页面初始化 options为页面跳转所带来的参数

},

onReady:function(){

// 页面渲染完成

},

onShow:function(){

// 页面显示

},

onHide:function(){

// 页面隐藏

},

onUnload:function(){

// 页面关闭

}

})

相关文章：

hello WeApp                      icon组件

Window                             text组件                                switch组件

tabBar底部导航                 progress组件                        action-sheet

应用生命周期                    button组件                            modal组件

页面生命周期                    checkbox组件        &nbsphttp://;              toast组件

模块化详                           form组件详                            loading 组件

数据绑定                           input 组件                             navigator 组件

View组件          &nbspuxmcre;               picker组件                             audio 组件

scroll-view组件                 radio组件                              video组件

swiper组件                        slider组件                              Image组件

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。