a-modal 弹出层

a-modal 提示框（visible）：

定义好组件

<a-modal
      title="加载中..."
      :visible="visible"
      width="400px"
      centered
      :footer="null"

      @cancel="handleCancel"
    >
      <a-progress :percent="percent"></a-progress>
    </a-modal>

	data() {
          
   
		visible:false,
		percent:0,
   }

代码如下（示例）：

// 点击事件中编写逻辑 
ExportClick () {
          
   
      that.percent = 0
      that.visible = true
      const downtime = setInterval(() => {
          
   
        // 定义setinterval percent++ 
        that.percent++
        if (that.percent >= 99) {
          
   
          clearInterval(downtime)
        }
      }, 100)
     
      axios.post(/, {
          
   
        ...setIdcardAttr,
      })
        .then(
	          function (res) {
          
   
	            if (res.data.responseCode === 10001) {
          
   
	              that.percent = 100
	              clearInterval(downtime)
	              that.visible = false
	              that.$message.success(下载成功)
	              window.location.href = `${
            
     res.data.data.url}`
	            } else {
          
   
	              that.visible = false
	            }
	          }
	        )
            .finally((res) => {
          
   
              that.$emit(afterClose)
              that.visible = false
            })
    },

世界因代码而改变