About vue+element ui to upload files

4180 단어 front end

html


     <el-upload
            class="upload-demo"
            action="localhost:8185/visitPlan/import"
            :before-upload="beforeAvatarUpload"
            :multiple="true"
            :limit="3"
            :on-exceed="handleExceed">
            <el-button size="small" type="primary" class="fs-btn fs-btn-primary fs-btn-md"> </el-button>
      </el-upload>
Determine the type of uploaded file

that is


     const isXlsx = file.type ==='application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
     const isXls = file.type === 'application/vnd.ms-excel'
     const isLt2M = file.size / 1024 / 1024 < 2
     console.log(isXls, isXlsx)
     if (!isXls && !isXlsx) {
     this.$message.error(' xls/xlsx !')
     }
     if (!isLt2M) {
     this.$message.error('  2MB!')
     }
     console.log('error', (isXlsx || isXls) && isLt2M)
     return (isXlsx || isXls)
But I encountered a problem at this time. I don't know why the .xls file type is blank in the console, which makes the .xls file fail to pass the judgment. So another method is used to cut the file name and judge the characters.

that is


    beforeAvatarUpload (file) {
          console.log(file.name)
          let Xls = file.name.split('.')
          if (Xls[1] === 'xls' || Xls[1] === 'xlsx') {
            return file
          } else {
            this.$message.error('  xls/xlsx  !')
            return false
          }
     }
UIStepper
request, session, application of struts2

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage