elementui实现只能上传单个文件，选择文件覆盖原有文件

在elementui 的上传组件中实现单文件上传，使用:limit="1" 属性限制选择文件个数，有个弊端就是当选择完一个文件之后就不能再继续选择文件，这并不是产品经理想要的，我们期望的结果是：当再次选择时直接覆盖上次上传的文件，保证文件列表中只有一个文件。

• accept属性可以限制文件类型，file-list是文件列表，action绑定文件上传路径
• 当手动提交文件时，使用this.$refs.upload.submit()来上传文件
• 选择文件可以触发钩子函数on-change，因此在on-change钩子函数中去操作。

//组件
<el-upload class="upload_wrap" ref="upload" action="uploadUrl" accept=".png" :auto-upload="false" 
 :file-list="fileList" :on-progress="onProgress" :on-change="onChange">
 <el-button slot="trigger" type="text"><i class="el-icon-upload" style="font-size:16px"></i>上传文件</el-button>
 <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
 <div slot="tip" class="el-upload__tip">只支持上传.h5文件，文件最大不得超过2G</div>
</el-upload>

//方法
// 限制文件上传的个数
  onChange(file, list) {
  	if (list.length > 1 && file.status !== "fail") {
      list.splice(0, 1);
    } else if (file.status === "fail") {
      errorMsg("上传失败，请重新上传！");
      list.splice(0, 1);
    }
 },
// 上传之前限制文件格式
  beforeUp(file) {
    const isH5 = file.name.split(".")[1] === "png";
    const isLt2G = file.size / 1024 / 1024 / 1024 < 2;
    if (!isH5) {
      errorMsg("仅支持上传.png文件");
	}
    if (!isLt2G) {
      errorMsg("上传文件大小不能超过 2G!");
    }
    return isH5 && isLt2G;
  },
submitUpload() {
  this.$refs.upload.submit();
},

//样式，去掉过渡动画
.upload_wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
/deep/ .el-list-enter-active,
/deep/ .el-list-leave-active {
  transition: none;
}

/deep/ .el-list-enter,
/deep/ .el-list-leave-active {
  opacity: 0;
}
/deep/ .el-upload-list__item-name {
  width: 300px;
}
/deep/ .el-upload-list {
  height: 40px;
}