mui消息弹框

mui消息弹框


最近在写前端h5+,发现一个Hbuilder,HbuilderX是个很好用的软件,里面已经包含了mui插件。下面我简单介绍一下mui四种消息框的用法。

  1. alert(警告框)
    mui.alert( message, title, btnValue, callback [, type] )
    message Type/value 备注
    message Type: String 提示对话框上显示的内容
    title Type: String 提示对话框上显示的标题
    btnValue Type: String 提示对话框上按钮显示的内容
    callback Type: String 提示对话框上关闭后的回调函数
    type Value: ‘div’ 是否使用h5绘制的对话框
mui.alert('欢迎使用Hello MUI', 'Hello MUI', function() {
        info.innerText = '警告框';
    });
  1. confirm(确认框)
    mui.confirm( message, title, btnValue, callback [, type] )
var btnArray = ['否', '是'];
mui.confirm('MUI是个好框架,确认?', 'Hello MUI', btnArray, function(e) {
        if (e.index == 1) {
            info.innerText = '你刚确认MUI是个好框架';
        } else {
            info.innerText = 'MUI没有得到你的认可,继续加油'
        }
    })
  1. prompt(对话框)
    mui.prompt( message, placeholder, title, btnValue, callback[, type] )
document.getElementById("promptBtn").addEventListener('tap', function(e) {
    e.detail.gesture.preventDefault(); //修复iOS 8.x平台存在的bug,使用plus.nativeUI.prompt会造成输入法闪一下又没了
	var btnArray = ['取消', '确定'];
	mui.prompt('请输入你对MUI的评语:', '性能好', 'Hello MUI', btnArray, function(e) {
		if (e.index == 1) {
	    	info.innerText = '谢谢你的评语:' + e.value;
	    } else {
	    	 info.innerText = '你点了取消按钮';
	    }
	})
});
  1. toast(消息提示框)
    mui.alert( message, title, btnValue, callback [, type] )
    message Type/value 备注
    message Type: String 提示对话框上显示的内容
    options Type: JSON 提示消息的参数
mui.alert('欢迎使用Hello MUI', 'Hello MUI', function() {
        info.innerText = '警告框';
    });

新手上路,只是简单的总结了一下mui消息弹框的用法。

你可能感兴趣的:(mui,mui)