van-dialog弹窗异步关闭功能-校验表单实现

 <van-dialog before-close="{{beforeClose}}" use-slot title="编辑指标" show="{{ editShow }}" show-cancel-button bind:close="onClose" bind:confirm="sureDialog" confirm-button-color="#3d7fff">
    <view class="edit_chunk">
           <!-- 这里写自定义的表单...... -->
    </view>
  </van-dialog>

  data: {
    beforeClose: null, // 绑定异步关闭函数
  },

// 封装异步关闭函数
dialogClost() {
     this.setData({
        beforeClose: (action) =>
          new Promise((resolve) => {
            if (action === 'confirm') {
              // 确定按钮
              resolve(false)
            } else if (action === 'cancel') {
              // 取消按钮
              resolve(true)
            }
          }),
      })
  },

// 确定
  sureDialog() {
    let { dataForm } = this.data;
    if (!dataForm.lineType) {
      wx.showToast({
        title: '请选择曲线类型',
        icon: 'none'
      })
      return this.dialogClost();
    }
  },

  dialogClost(type) {
      this.setData({
        beforeClose: (action) =>
          new Promise((resolve) => {
            if (action === 'confirm') {
              // 点击确定，根据传入的状态判断是否取消
              resolve(type)
            } else if (action === 'cancel') {
              // 取消则直接关闭
              resolve(true)
            }
          }),
      })
  },

// 确定
  sureDialog() {
    let { dataForm } = this.data;
    if (!dataForm.lineType) {
      wx.showToast({
        title: '请选择曲线类型',
        icon: 'none'
      })
      return this.dialogClost(false); // 表单校验不通过
    }
    this.dialogClost(true); // 表单校验通过
  },