antd-vue upload 上传前验证

表单:

<a-form-model ref="form" :model="form" layout="horizontal" :label-col="{ span: 3 }" :wrapper-col="{ span: 18 }">
      <a-form-model-item label="论证结果" prop="lzResult"
                         :rules="{required:true,message:'请选择结果'}">
        <j-dict-select-tag v-model="form.lzResult" :type="'radio'" dictCode="expert_lz_result"/>
      </a-form-model-item>
      <a-form-model-item label="内容" prop="lzResultContent"
                         :rules="{required:true,message:'请输入内容'}">
        <a-textarea placeholder="论证结果" v-model="form.lzResultContent" :rows="10"/>
      </a-form-model-item>
      <a-form-model-item label="附件" prop="lzResultFile"
                         :rules="{required:true,message:'请上传论证报告'}">
        <a-upload :showUploadList="false" :multiple="false"
                  :headers="tokenHeader" :action="url.uploadUrl"
                  :accept="accept" :data="{biz:'lzresult'}"
                  :before-upload="beforeUpload" @change="handleChangeUpload">
          <a-button>
            <a-icon type="upload"/>
            选择文件
          </a-button>
        </a-upload>
        <a v-if="form.lzResultFile" @click="downFile(form.lzResultFile)">下载</a>
      </a-form-model-item>
    </a-form-model>

代码:

上传前:
 beforeUpload(file) {
      return new Promise((resolve, reject) => {
        this.form.lzResultFile = file.name //设置个临时值,用来通过form验证
        this.$refs.form.validate((valid) => {
          if (valid) {
            let index = file.name.lastIndexOf('.')
            let type = file.name.substring(index + 1)
            type = '.' + type
            if (this.fileType.indexOf(type) >= 0) {
              resolve()
            } else {
              this.$message.error('上传的文件格式不符合系统要求')
              reject()
            }
          } else {
            reject()
          }
        })
      })
    },

上传发生变化:
handleChangeUpload(info) {
      if (!info.file.status) {
        info.fileList.pop()
      }
      if (info.file.status !== 'uploading') {
      }
      if (info.file.status === 'done') {
        this.$message.success(`${info.file.name} 上传成功`)
        this.form.lzResultFile = info.file.response.message //保存的文件路径赋值给界面变量
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败`)
      }
    },
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值