1. 引入文件:
2. html:
3. js:
var mobileSelect1 = new MobileSelect({
trigger: '#trigger1',
title: '单项选择',
wheels: [
{data: weekdayArr}
],
position:[2], //初始化定位 打开时默认选中的哪个 如果不填默认为0
transitionEnd:function(indexArr, data){
//console.log(data);
},
callback:function(indexArr, data){
console.log(data);
}
});
4. 说明:
参数:
trigger(必填参数) 触发对象的id/class/tag
wheels(必填参数) 数据源,需要显示的数据
title 控件标题
position 初始化定位
callback 选择成功后触发的回调函数,返回indexArr(选中的选项索引)、data(选中的数据)
transitionEnd 每一次手势滑动结束后触发的回调函数,返回indexArr(当前选中的选项索引)、data(选中的数据)
keyMap 字段名映射
函数:
setTitle() 参数 string 设置控件的标题
updateWheel() 参数 sliderIndex, data 重新渲染指定的轮子(可用于先实例化,后通过ajax获取数据的场景)
updateWheels() 参数 data 重新渲染所有轮子,仅限级联数据格式使用(可用于先实例化,后通过ajax获取数据的场景)
locatePosition() 参数 sliderIndex, posIndex 传入位置数组,重定位轮子的位置
show() 参数 无参 唤起弹窗组件
getValue() 参数 无参 获取组件选择的值