小程序 | Vant Weapp Dialog 弹出框的before-close用法

弹出框点击确认按钮会自动关闭，但是项目需要在点击确认前校验是否选择了角色，所以要阻止默认关闭事件。

wxml

//弹窗
<view class="dialogConBox">
    <van-radio-group value="{{ radio }}" bind:change="getUserType">
      <van-cell-group>
        <van-cell title="供体" clickable data-name="donor">
          <van-radio checked-color="#00c389" slot="right-icon" name="donor" />
        </van-cell>
        <van-cell title="受体" clickable data-name="receptor">
          <van-radio checked-color="#00c389" slot="right-icon" name="receptor" />
        </van-cell>
        <van-cell title="医生" clickable data-name="sysUser">
          <van-radio checked-color="#00c389" slot="right-icon" name="sysUser" />
        </van-cell>
      </van-cell-group>
    </van-radio-group>
  </view>
</van-dialog>

//验证提示
<van-toast id="van-toast" />

 JS

Page({
  data: {
    show: false,
    radio: '', 
    beforeClose(action) {
      return new Promise((resolve) => {
        setTimeout(() => {
          if (action === 'confirm') {
            // 拦截确认操作
             resolve(false);
          } else {
            resolve(true);
          }
        }, 0);
      });
    }
  },
  //选择角色确认按钮事件
  getUserInfo() {
    if(!this.data.radio){
      wx.showToast({
        title: '请选择角色',
        icon:'none'
      })
      return
    }
    //在这里写选择角色点击确认后要做的事件或调用的接口方法等等...

    //调用关闭弹窗方法
    this.onClose();
  },
 //关闭弹窗
 onClose() {
      this.setData({ show: false });
 },
 //获取用户选择角色
 getUserType(event){
    this.setData({
      radio: event.detail,
    });
 },
})