uni-app mui closePopup 关闭 mui.confirm 时 会触发 e.index == 0 事件

uni-app mui closePopup 关闭 mui.confirm 时 会触发 e.index == 0 事件

产品分类:其他/MUI

示例代码:

<!DOCTYPE html>  
<html lang="zh-cn">  
<head>  
    <meta charset="UTF-8">  
    <title>mui</title>  
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />  
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  

<link rel="stylesheet" href="//dev.dcloud.net.cn/mui/dist/css/mui.min.css?v=2017-02-15 11:53:40 +0800">  
</head>  
<body>  

<div class="mui-content">  
<br /><br /><br />  
<input type="button" id="a" name="a" value="弹出" onclick="test()" />  
<br /><br /><br />  
<input type="button" id="a" name="a" value="关闭" onclick="close()" />  
请在console中执行close()  
</div>  

<script src="https://dev.dcloud.net.cn/mui/dist/js/mui.min.js?v=2017-02-15%2011:53:40%20+0800"></script>  

<script>  
mui.init({  
    swipeBack: false  
});  

function test() {  
    var str = '欢迎使用平台。';  
    var btnArray = ['不同意', '同意'];  
    mui.confirm(str, '用户注册须知', btnArray, function(e) {  
        console.log(e);  
        if (e.index == 1 ) {  
            console.log('你点击了同意');  
            //todo  
        } else {  
            console.log('你点击了不同意');  
            //closePopups时会触发index=0事件  
        }  
    });  
    return false;  
}  

function close() {  
    mui.closePopups();  
}  
</script>  

操作步骤:

弹出后,请在console中执行close()来关闭。

预期结果:

console中显示【你点击了不同意】

实际结果:

mui closePopup 关闭 mui.confirm 时,会触发e.index == 0的取消事件

bug描述:

Mui v3.7.3
mui closePopup 关闭 mui.confirm 时,会触发e.index == 0的取消事件


更多关于uni-app mui closePopup 关闭 mui.confirm 时 会触发 e.index == 0 事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app mui closePopup 关闭 mui.confirm 时 会触发 e.index == 0 事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个已知的MUI框架行为特性。当使用mui.closePopups()关闭confirm弹窗时,框架会默认触发取消按钮(index=0)的回调事件。这是因为MUI内部将关闭操作视为用户主动取消的行为。

解决方案:

  1. 可以在回调函数中添加额外判断,区分是用户点击还是程序关闭:
var isManualClose = false;
function test() {
    mui.confirm(str, '标题', btnArray, function(e) {
        if(isManualClose) return;
        // 正常处理逻辑
    });
}

function close() {
    isManualClose = true;
    mui.closePopups();
}
  1. 或者改用uni-app自带的模态框API:
uni.showModal({
    title: '标题',
    content: '内容',
    success(res) {
        if(res.confirm) {
            // 确认
        } else if(res.cancel) {
            // 取消
        }
    }
})
回到顶部