ant design vue：upload打开选择文件弹框前弹出确认框

看antd文档，刚开始我用得beforeUpload来实现，勉强能完成我想要的功能，但是流程上不完美，需要先选择了文件，才能弹出确认框，但是我的确认框其实跟文件没有关系，我想要先弹确认框再打开文件选择弹框。

继续搜索，发现一个解决思路是使用两个按钮叠加，上层的普通按钮点击后弹出确认框，点了确认后再使用ref的click来触发upload组件内部的按钮点击事件，但是这个方案有一些瑕疵，比如我还得使用css将两个按钮叠加起来，还需要想办法阻止下层按钮的点击事件。

继续看antd文档，发现openFileDialogOnClick这个属性能解决我的问题。

初始状态下openFileDialogOnClick设置为false，给upload组件里的button添加点击事件，在点击事件里去弹出确认框，在确认框里点了确定，我们在将openFileDialogOnClick设置为true，然后我们在用ref来触发upload，文件选择框就可以打开了。

需要注意的是，当我们使用ref触发click的时候，原来在button上添加的点击事件也会触发，所以当openFileDialogOnClick为true的时候，确认框依旧会弹出来，这时候需要加判断，只有当openFileDialogOnClick为false的时候才弹出确认框。文件上传结束后，还要记得将openFileDialogOnClick恢复初始值false。

            考生基本信息导入
          

handleClick(){
        //当openFileDialogOnClick为false的时候，要弹出确认框
        if(!this.openFileDialogOnClick){
          this.getProjectName();
        }
      },
      getProjectName(){
        if(!this.projectId){
          this.$message.error("请选择项目!");
          return
        }
        let projectName = '';
        let url = this.url.queryById+'?projectId='+this.projectId;
        getAction(url).then(res => {
          if (res.success) {
            projectName = res.result.name;
            this.$confirm({
              title: '导入确认',
              content: '请确定项目名称：'+projectName,
              okText: '确定导入',
              cancelText: '取消导入',
              onOk: () => {
                // 上传前的事件处理完成后，触发上传文件的事件
                this.confirmImport();
              },
              onCancel: () => {
                this.openFileDialogOnClick = false;
                return
              },
            });
          }else{
            this.$message.warning(res.message)
          }
        })
      },
confirmImport(){
        this.$confirm({
          title: '考生基本信息导入确认',
          content: '每次导入会覆盖原来的数据，确定导入吗？',
          okText: '确定导入',
          cancelText: '取消导入',
          onOk: () => {
            this.openFileDialogOnClick = true;
            setTimeout(()=>{
              // 点击按钮，打开选择文件的对话框
              this.$refs["btn"].$el.click();
            },50)
          },
          onCancel: () => {
            this.openFileDialogOnClick = false;
            return
          },
        })
      },

我这个案例里弹了两次确认框。