WeChat applet development: picker scroll selector details

Component Description: picker: the scroll selector. Currently, three selectors are supported. They are distinguished by the mode attribute, namely, the modeselector, the modetime, and the modedate ), the default value is normal selector. Component Description:

Picker:

Scroll selector. three selectors are supported. They are distinguished by the mode attribute, namely normal selector, time selector (mode = time), and date selector (mode = date ), the default value is normal selector.

Wxml

   
      
   
    
Picker
       
   
    
Selector
     
    
      
         
    
     
Region Selector
          
            
     
      
Current selection: {array [index]}
           
        
       
         
    
     
Time selector
          
            
     
      
Current selection: {time }}
           
        
       
         
    
     
Date selector
          
            
     
      
Current selection: {date }}
           
        
     
  
 

Js

Page ({data: {array: ['China', 'America ', 'Brazil', 'Japan '], index: 0, date: '2017-09-01', time: '12: 01'}, bindPickerChange: function (e) {console. log ('picker transmission selection changed, carrying value ', e. detail. value) this. setData ({index: e. detail. value})}, bindDateChange: function (e) {this. setData ({date: e. detail. value})}, bindTimeChange: function (e) {this. setData ({time: e. detail. value })}})

Wxss

.page {    min-height: 100%;    flex: 1;    background-color: #FBF9FE;    font-size: 32rpx;    font-family: -apple-system-font,Helvetica Neue,Helvetica,sans-serif;    overflow: hidden;}.page__hd{    padding: 50rpx 50rpx 100rpx 50rpx;    text-align: center;}.page__title{    display: inline-block;    padding: 20rpx 40rpx;    font-size: 32rpx;    color: #AAAAAA;    border-bottom: 1px solid #CCCCCC;}.page__desc{    display: none;    margin-top: 20rpx;    font-size: 26rpx;    color: #BBBBBB;}.picker{  padding: 26rpx;  background-color: #FFFFFF;}.section{    margin-bottom: 80rpx;}.section__title{    margin-bottom: 16rpx;    padding-left: 30rpx;    padding-right: 30rpx;}

Main Attributes:

Normal selector: (mode = selector)

The above is the small program development: picker scroll selector details, more please follow the first PHP community other related articles!