前端vue打开多个窗口，关闭窗口后才继续执行后续逻辑

1.打开第一个弹窗

弹窗的按钮代码

2.点击窗口1中按钮，打开新的窗口

 // 请领单按钮点击
async cb_6_delClick() {let ls_yfbm = this.st_3Value.BMBMlet pstring = {}pstring.a = ls_yfbmpstring.b = this.queryFormDialog.outDepotDeptCodeawait this.openwithparm_w_md_ckgl_lyjh_yfly(pstring)// 防止此方法多次被调用已打开窗口if (!this.dialog_uo_3) {this.dialog_uo_3 = true}await new Promise((resolve) => {this.$watch('dialog_uo_3', (newVal) => {if (newVal === false) {resolve();}});});// 出库数量大于库存数量时，将出库数量改成库存数量for (let i = 0; i < this.adviceTableCalc.length; i++) {let ldc_cksl = this.adviceTableCalc[i].CKSLlet ldc_kcsl = this.adviceTableCalc[i].KCSLif (ldc_cksl > ldc_kcsl) {this.adviceTableCalc[i].CKSL = ldc_kcsl} else {this.adviceTableCalc[i].XH = i}}},

// 下面这一行代码是打开窗口前的一些逻辑，可以不用管不是该博客要讨论的重点
await this.openwithparm_w_md_ckgl_lyjh_yfly(pstring)
// 下面这一行代码的执行会打开第2个窗口this.dialog_uo_3 = true

第2个窗口代码 

 

3.打开的第2个窗口 

 第2个窗口的确定按钮点击以后会关闭，那么就会展示第1个窗口了

可以看到方法 saveDialog_cb_3()方法的最后一行执行了关闭第2个窗口的操作 this.dialog_uo_3 = false

// 请领单确定按钮点击async saveDialog_cb_3() {let lb_init, lstr_rtn, ll_find, ll_drbm, ls_ksmcawait this.cb_4_w_md_ckgl_lyjh_yfly()// todo// w_md_ckgl_fygl_fyxz_yfly.dw_1.reset()// w_md_ckgl_fygl_fyxz_yfly.dw_2.reset()this.dw_1_qld.map(item => {if (item.XZ === 1) {ll_find = item}})if (validatenotnull(ll_find)) {ll_drbm = ll_find.DRBMls_ksmc = ll_find.KSMC// todo// w_md_ckgl_fygl_fyxz_yfly.uo_gys.uf_settext(string(ll_drbm),ls_ksmc)}if (this.orgName != '湖北中医药大学国医堂' || this.orgName != '湖北中医药大学黄家湖医院') {// todo 8.0没有找到sle_bz这个控件，is_djh这个值8.0是在wf_bzxx()方法赋值的// w_md_ckgl_fygl_fyxz_yfly.sle_bz.text = this.is_djh}console.log("this.dw_ckmx_temp:",this.dw_ckmx_temp)this.dw_ckmx_temp.forEach(item => {this.adviceTableCalc.push(item)})this.dw_ckmx.forEach(item => {this.applyTable.push(item)this.applyTableCalc.push(item)})this.applyTable = this.applyTable.map((item, index) => {return {...item,id: index}})this.applyTableCalc = this.applyTableCalc.map((item, index) => {return {...item,id: index}})this.adviceTableCalc = this.adviceTableCalc.map((item, index) => {return {...item,id: index}})// 初始化制空this.dw_ckmx_temp = []this.dw_ckmx = []this.$nextTick(() => {this.$refs.adviceTableCalc_03_04_07.setCurrentRowByIndex(0);this.dialogRowClick_04_03_07(this.adviceTableCalc[0])})this.dialog_uo_3 = false},

那么此时这一段代码会监听到 dialog_uo_3的值变成了false也就是我们的第2个窗口被关闭了，就会继续执行在第一个窗口打开第2个窗口等待第2个窗口关闭才继续执行的阻塞效果。

 await new Promise((resolve) => {
        this.$watch('dialog_uo_3', (newVal) => {
          if (newVal === false) {
            resolve();
          }
        });
      });

所以下面这一段代码只有在第2个窗口被关闭时才会继续执行，否则一直阻塞等待窗口关闭 

 // 出库数量大于库存数量时，将出库数量改成库存数量
      for (let i = 0; i < this.adviceTableCalc.length; i++) {
        let ldc_cksl = this.adviceTableCalc[i].CKSL
        let ldc_kcsl = this.adviceTableCalc[i].KCSL
        if (ldc_cksl > ldc_kcsl) {
          this.adviceTableCalc[i].CKSL = ldc_kcsl
        } else {
          this.adviceTableCalc[i].XH = i
        }
      }