Hbuilder MUI 下拉选择与时间选择器

一、 Hbuilder 下拉选择

<link rel="stylesheet" href="../../../assets/mui/css/mui.picker.min.css" />

<script type="text/javascript" src="../../../assets/mui/js/mui.picker.min.js"></script>

//引用mui.picker 的css与js

var specModel=new mui.PopPicker(); //初始化 picker
var item=[
     {text:测试1,value:0},
     {text:测试2,value:1},
     {text:测试3,value:2},
] //data必须是text与value的。
specModel.setData(item);
specModel.show(function(itme){ 
        //这里的item就是你选中的item
        var specModelName=item.text;
        var specModelValue=item.value;
})

//(*￣︶￣)  这样一个简单的下拉就完成了 自己按照自己项目需求分装item就行

二 、Hbuilder 时间选择器

1.日期选择器

var Date=new mui.DtPicker({type:'date'});
Date.show(function(item){
      //这里你可以用console 看看回调函数中的item的值 
      console.log(Json.Stringify(item));
      var endDate=item ;
      var endDate=item.y.text + '/' + item.m.text + '/' + item.d.text;
      //这两种都是可以的
})

2.日期时间选择器

var Date=new mui.DtPicker({type:'datetime'});
Date.show(function(item){
      //改变一下type值就行 
      console.log(Json.Stringify(item));
      var endDate=item ;
})

结语：MUI 一直在维护，功能也在不断完善 基本满足项目需求， 用完以后感叹一句使用Hbuilder开发真的是很爽快的。