elementui el-upload上传头像图片大小不能超过 5MB!

最新推荐文章于 2024-05-23 20:22:57 发布

豆本豆、

最新推荐文章于 2024-05-23 20:22:57 发布

阅读量1k

点赞数

分类专栏：前端文章标签： elementui 前端 javascript

本文链接：https://blog.csdn.net/qq_64180379/article/details/126388634

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

直接上代码

组件给我们提供了图片上传的大小以及格式

拿来用即可，绑定事件

:before-upload="beforeAvatarUpload"

事件处理：

// 使用 before-upload 限制用户上传的图片格式和大小
    beforeAvatarUpload(file) {
      console.log('file',file)
      const suffix = file.type === 'image/jpg' || file.type === 'image/png' || file.type === 'image/jpeg'
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!suffix) {
        this.$message.error("上传头像图片只能是 JPG 格式!");
      }
      if (!isLt5M) {
        this.$message.error("上传头像图片大小不能超过 5MB!");
      }
      return suffix && isLt5M;
    },