input上傳、el-upload

代碼案例:

<el-upload
          class="upload-demo"
          drag
          action="https://jsonplaceholder.typicode.com/posts/"
          :on-success="handelSuccess"
          :on-progress="handelProgress"
          :before-upload="handelBeforeUpload"
          multiple
          accept="image/jpg, image/png"
        >
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">
            請把文件(或壓縮包)拖放至此區域
            <em>點擊上傳</em>
            <br />(支持jpg、png、pdf等文件格式,其他格式可能無法識別)
          </div>
          <!-- <div class="el-upload__tip" slot="tip">(支持jpg、png、pdf等文件格式,其他格式可能無法識別)</div> -->
        </el-upload>
// 文件上傳成功時
    handelSuccess(response, file, fileList) {
      console.log("上傳成功", response, file, fileList);
    },
    // 文件上傳時
    handelProgress(event, file, fileList) {
      console.log("上傳時", event, file, fileList);
    },
    //
    handelBeforeUpload(file) {
      console.log(file);
      let isImage = file.type === "application/pdf";
      if (!isImage) {
        this.$message.error("上傳文件只能是PDF格式!");
      }
      return isImage;
    }

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章