关于vue+element对ie9的兼容el-upload不支持在IE9上传
https://lian-yue.github.io/vue-upload-component/#/zh-cn/
解决方案 采用vue-upload-component
npm install vue-upload-component --save
<template> <div class="app-container"> <el-row class="page-content"> <el-col :span="24" style="margin:20px"> <el-form label-width="200px" class="addform"> <el-form-item label="附件"> <file-upload class="el-button margin_left10 el-button--primary el-button--small" style="overflow:visible" :maximum="1" :multiple="false" ref="upload" v-model="files" post-action="url" @input-file="inputFile" @input-filter="inputFilter" > <span style="color:#FFFFFF">选取文件</span> </file-upload> <el-button size="small" type="primary" v-show="!$refs.upload || !$refs.upload.active" @click.prevent="$refs.upload.active = true" > <span style="color:#FFFFFF">开始上传</span> </el-button> </el-form-item> <el-form-item label="文件列表" class="fileList" v-show=" files.length>0"> <ul class="el-upload-list el-upload-list--text"> <li class="el-upload-list__item is-ready" v-for="(file,index) in files" :key="index"> <span>{{file.name}}</span> </li> </ul> </el-form-item> </el-form> </el-col> </el-row> </div> </template> <script> import { getFileId, deleteFileId } from "@/api/flca"; import "vue-upload-component/dist/vue-upload-component.part.css"; import FileUpload from "vue-upload-component"; export default { components: { FileUpload }, data() { return { files: [], }; }, methods: { upLoad() { this.$refs.upload.active = true; }, inputFilter(newFile, oldFile, prevent) { if (newFile && !oldFile) { const extension = newFile.name.substring(newFile.name.lastIndexOf(".") + 1); console.log(extension); if (extension =='pdf' ||extension =='PDF' ) { } else { this.$message({ message: "上传文件只能是pdf格式文件!", type: "warning" }); return prevent(); } } }, inputFile(newFile, oldFile) { if (newFile && oldFile) { // 更新文件 // 开始上传 if (newFile.active !== oldFile.active) { console.log("Start uploa3333333333333333d",newFile.size) console.log("Start upload", newFile.active, newFile); this.isXls = false; } // 上传进度 if (newFile.progress !== oldFile.progress) { console.log("progress", newFile.progress, newFile); } // 上传错误 if (newFile.error !== oldFile.error) { console.log("error", newFile.error, newFile); this.$message({ message: "上传失败!", type: "error" }); } // 上传成功 if (newFile.success !== oldFile.success) { console.log("success", newFile.success, newFile); this.$message({ message: "上传成功!", type: "success" }); } } } } }; </script>