自動アップロード:false
:on-change="ハンドル変更"
<el-upload
multiple
:auto-upload="false"
:action="uploadImgUrl"
list-type="picture-card"
:on-success="handleUploadSuccess"
:before-upload="handleBeforeUpload"
:limit="limit"
:on-error="handleUploadError"
:on-exceed="handleExceed"
ref="imageUpload"
:on-remove="handleDelete"
:show-file-list="true"
:headers="headers"
:file-list="fileList"
:on-preview="handlePictureCardPreview"
:class="{hide: this.fileList.length >= this.limit}"
accept="image/jpeg,image/png"
:on-change="handleChange"
>
<i class="el-icon-plus"></i>
</el-upload>
<!-- 上传提示 -->
<div class="el-upload__tip" slot="tip" v-if="showTip">
请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{
{ fileSize }}MB</b> </template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{
{ fileType.join("/") }}</b> </template>
的文件
</div>
ファイル名を変更する方法 (ファイル名に多くの特殊記号が含まれていると、ファイルのアップロードでエラーが報告されます):
handleChange(file) {
let fileArr =file.name.split('.');
let name=fileArr[0];
let fileType=fileArr[1];
let Exp=/[\-\_\,\!\|\~\`\(\)\#\@\]\[\$\%\^\&\*\{\}\:\;\"\L\<\>\?]/g;
name = name.replace(Exp,"");
let f = new File([file.raw],name+'.'+fileType);
f.uid = file.uid; // new File 没有uid属性,会导致组件底层报错,这里手动加上
file.raw = f; // 用f替换file的数据
console.log(file.raw)
this.$refs.imageUpload.submit(); // 手动触发上传
},