页面历史记录

移动端UI 控件操作手册

1. 通用列表MUIList

• 效果图
• Image Added

• 填充数据方法

MUIList.setListData('list',[{name:'item1',id:1},{name:'item2',id:2},{name:'item3',id:3},{name:'item4',id:4}])

解释：list：控件名称

      数据结构：

[{name:'item1',id:1},{name:'item2',id:2},{name:'item3',id:3},{name:'item4',id:4}]

• 列表选项点击事件

    Image Added

• 获取列表点击选项的数据

var id = MUIList.getListItemId(event)

var text = MUIList.getListItemText(event)

上述方法在列表的点击事件中，可以获得该选项的id和text，用于相关的业务处理

2. 移动端开关 MUISwitch

• 效果图

Image AddedImage Added

• var f = MUISwitch.getSwitchStatus('switch')

 在点击事件中调用此方法，传入控件名称，获取switch切换状态，返回true or false

3. 多选按钮MUICheckbox

• 效果图

Image AddedImage Added

• var f = MUICheckbox.getCheckboxValue('checkbox')

在点击事件中调用此方法，传入控件名称，获取checkbox选中状态，返回true or false

• setCheckboxValue('checkbox',true)

设置checkbox选中状态 传入控件名称和true/false

4. 单选按钮MUIRadio

• 效果图

Image Added

• 同一组radio需要配置相同的名称

Image Added

• var f = getRadioValue('radio1')

在点击事件中调用此方法，传入控件名称，获取radio1选中状态，返回true or false

• setRadioValue('radio1',false)

设置radio1选中状态 传入控件名称和true/false

5. 通用选择器MUIPicker

Image Added

• 拖拽放置一个文本输入框
• showPopPicker([{text:'test1',value:'1'},{text:'test2',value:'2'},{text:'test3',value:'3'}],function(data){

console.log(data)

});

在文本输入框click点击事件中，调用此方法，传入数据结构：

[{text:'test1',value:'1'},{text:'test2',value:'2'},{text:'test3',value:'3'}]和callback回调函数function(data){console.log(data)},在回调函数中获取选中的数据，作为业务处理

• 效果图

Image Added

6. 日期选择器MUIDatePicker

• 拖拽一个文本输入框
• showPopDatePicker(function(data){

    console.log(data)

}，type);

在文本输入框click点击事件中，调用此方法，传入callback回调函数function(data){console.log(data)} 和type（可省略，默认值：datetime，全部日期类型：datetime、date、time、month、hour）

在回调函数中获取选中日期，作为业务处理

• 效果图
• Image Added

7. dialog弹框

• muiAlert('请输入密码')

MUIDialog.muiAlert(msg,title,callback)

参数:msg:内容，title:标题，callback:关闭时触发,业务处理

• 效果图

Image Added

• muiConfirm('确认删除？')

MUIDialog.muiConfirm(msg,title,callback)

参数:msg:内容，title:标题，callback:关闭时触发,业务处理

• 效果图

Image Added

• muiToast(‘删除成功！’)
• muiToast(msg)
• 效果图

Image Added