限制上传文件（图片）大小

油乐王子

于 2021-11-05 15:03:36 发布

阅读量349

点赞数

分类专栏：笔记文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/weixin_54757930/article/details/121163343

版权

笔记专栏收录该内容

62 篇文章

订阅专栏

本文介绍了如何使用JavaScript在前端实现文件上传时对图片大小进行限制，确保上传的文件不会过大，从而优化用户体验并减轻服务器压力。通过读取File对象的size属性，可以检查文件大小并在超过设定阈值时给予用户反馈。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

:before-upload="handleBeforeUpload"

handleBeforeUpload(file) {
      // console.log(file);
      this.loading = this.$loading({
        lock: true,
        text: "上传中",
        background: "rgba(0, 0, 0, 0.7)"
      });
      const isLt2M = file.size / 1024 / 1024 < 3     //这里做文件大小限制
      if(!isLt2M) {
        this.$message({
          message: '上传文件大小不能超过 3MB!',
          type: 'error'
        });
        this.loading.close()
      }
      return isLt2M
    },