Vant 2 - 解决 Dialog 弹出框组件点击 “确定“ 按钮后，模态框消失隐藏了（beforeClose 关闭前回调的使用，可阻止关闭）

前言

该问题官方文档已经给出了解决方案，即 beforeClose 属性，但是描述有些晦涩。

本文来演示一下正确的使用方法，

点击确定后并不会关闭模态框，如下图所示：

解决方案

代码只保留了核心代码，无用配置没有写出来，方便您观察。

在组件上绑定 before-close 属性，属性值为一个函数。

	...

/**
 * 阻止模态框关闭
 * @description 根据操作判断
 * @param {String} action - 是确定还是取消
 * @param {Function} done - 操作函数
 * @return Function
 */
onBeforeClose(action, done) {
	// 点击了确定按钮
    if (action === "confirm") {
    	// if()...也可以加入一些条件
        return done(false);//直接return它即可阻止
    }
    // 点击了取消按钮
    else {
        done(true); //关闭弹窗, true可以省略
    }
}

SEO

Vant 2 解决 Dialog 弹出框组件点击 “确定” 按钮后，模态框消失隐藏了（beforeClose 关闭前回调的使用，可阻止关闭）Vant Weapp Dialog 弹出框的before-close用法Dialog弹框案例vant中的dialog弹框怎么阻止弹框隐藏点击确定弹框就消失了Vant-ui组件 Dialog里的before-close阻止关闭“确认”验证失败时阻止对话框的关闭。