iview中解决Modal 对话框连续调用两次后，第二次闪一下就消失的问题

问题描述

iView中用到一个this.$Modal.confirm对话框，确认后再执行确定动作后，弹出this.$Modal.info对话框告诉用户执行结果，结果是第二个info对话框闪了以下就消失了；

问题分析

debug发现，如果confirm后，执行的动作花的时间长一点的话，第二个info对话框就能显示了！估计是这里的Modal采用的隐藏开关用的同一个变量，第一个消失的时候，导致第二个也跟着消失了。

解决办法

既然执行的动作花的时间长一点就能解决，也就是说只要给第一个对话框足够的时间让它消失，再执行下一步的动作就可以了，我们可以在第一个对话框onOk事件里，套一个timeout，经过研究，发现如果timeout设定为500ms就可以了，代码如下：

reportClicked: function() {
    var _this = this;
    // 第一个Modal对话框
    this.$Modal.confirm({
        title: '确认',
        content: '确定要怎么怎么样吗?',
        onOk: function () {
            // 等待500ms后，再指定doReport
            setTimeout(function(){_this.doReport()}, 500);
        }
    });
},
doReport: function() {
    var _this = this;
    var payload = {type: "1"};
    axios.post('centers/report', Qs.stringify(payload))
        .then(function (response) {
            //第二个Modal对话框这时候肯定能弹出了
            _this.$Modal.info({
                title: '结果',
                closable: true,
                content: response.message
            });
        })
        .catch(function (error) {
            _this.reporting = false;
            _this.$Message.error("错误，请稍后再试：" + error.status);
        });
}