elementUI上传图片限制格式与大小
elementUI上传图片限制格式与大小
天青色等烟雨,而我在等你,月色被打捞起,是否记住了结局
结构: <el-upload action="https://jsonplaceholder.typicode.com/posts/" :before-upload="beforeAvatarUpload"> <i class="el-icon-plus"></i> </el-upload> <el-dialog :visible.sync="dialogVisible"> <img width="100%" :src="poster" alt="" /> </el-dialog>
上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。
事件
beforeAvatarUpload(file) { var testmsg = file.name.substring(file.name.lastIndexOf(".") + 1); const extension = testmsg === "jpg" || testmsg === "JPG" || testmsg === "png" || testmsg === "PNG" || testmsg === "bpm" || testmsg === "BPM"; const isLt50M = file.size / 1024 / 1024 < 10; if (!extension) { this.$message({ message: "上传图片只能是jpg / png / bpm格式!", type: "error" }); return false; //必须加上return false; 才能阻止 } console.log(file); if (!isLt50M) { this.$message({ message: "上传文件大小不能超过 10MB!", type: "error" }); return false; } return extension || isLt50M; }