MUI选择器

MUI框架扩展了Picker组件,可用于弹出单级或多级选择器,poppicker和dtpicker是对picker的具体实现

PopPicker示例】

注:PopPicker组件依赖mui.picker.js/.css和mui.poppicker.js/.css,请务必在mui.js/css后中引用。

1. 初始化PopPicker组件对象

var picker = new mui.PopPicker();

2. 给对象设置数据集

picker.setData([{value:'fish',text:'鱼'},{value:'paws',text:'熊掌'}]);

3. 显示PopPicker对象

picker.show(SelectedItemsCallback)

注:SelectedItemsCallback为回调函数


下面直接上代码:)

  
    
      
      PopPicker
           
      
      
      
      
      
    
     
    

注:picker.setData();数据集可以[{value:'',text:''},{value:'',text:''}]格式后台动态生成

效果如下图:

MUI选择器_第1张图片


【DtPicker示例】

1. 初始化DtPicker组件对象

var dtpicker = new DtPicker(options);

注:options选项详见MUI官网

2. 显示dtpicker对象

dtpicker.show(SelectedItemsCallback)

注:SelectedItemsCallback为回调函数


下面是DtPicker代码示例:

  
    
  	
		DtPicker
         
    
		
		
		
		
   
    
     
    

效果如下图:

MUI选择器_第2张图片

你可能感兴趣的