ElementUI中el-upload中怎样限制上传文件的格式

这个业务逻辑多少都有点奇怪了，阅读浏览次数增值在新闻详情页的控制器方法里setInc，这怎么还写进模型事件里了。如果非要用onAfterRead也可以，把新闻文章的内容单独分出来一个news_content表，然后把它和news做关联，然后给news_content表的onAfterRead事件做增值处理，这样点进新闻页内查询到文章内容时才会触发它。: 评 TP6模型事件-查询后onAfterRead不好用

文章标签更多

ThinkPHP (254)

Mysql (58)

DedeCms (33)

jQuery (67)

证件照 (1)

尺寸大小 (2)

背景颜色 (1)

setInc (4)

setDec (4)

onclick (5)

友情链接更多

超纯水设备

免费设计

海报设计

快递查询

element UI el-upload

打开边栏(ESC) 关闭边栏(ESC)

ElementUI中el-upload中怎样限制上传文件的格式

1,需求

使用el-upload上传文件时限制只能上传指定格式的文件。
比如这里只允许上传jpg,png格式的文件。
2，实现

通过添加accept=".jpg,.png"来添加打开时的默认类型

<el-upload
            :headers="headers"
            :action="url"
            :multiple="false"
            :file-list="fileList"
            :on-remove="fileRemove"
            :on-success="uploadSuccess"
            :on-error="uploadError"
            :on-progress="uploadProgress"
            :before-upload="beforeUpload"
            :limit="1"
            :on-exceed="beyond"
            accept=".jpg,.png"
          >

但是这样只能限制打开时默认的选择类型，还是可以进行更改为All

from clipboard

重写
:before-upload="beforeUpload"
在方法中

方式1：

beforeUpload(file) {
      var testmsg = file.name.substring(file.name.lastIndexOf(".") + 1);
      const extension = testmsg === "jpg";
      const extension2 = testmsg === "png";
      if (!extension && !extension2) {
        this.$message({
          message: "上传文件只能是.jpg,.png格式!",
          type: "warning",
        });
        return false
      }
      return true;
    },

方式2：

beforeUpload(file) {
      var fileName = file.name.substring(file.name.lastIndexOf(".") + 1);
      let typeInfo = ["jpg", "png"];
      fileName = fileName.toLowerCase();
      if (!typeInfo.includes(fileName)) {
        this.$message({
          message: "上传文件只能是.jpg,.png格式!",
          type: "warning",
        });
        return false
      }
      return true;
    },

方式3：

beforeUpload(file) {
  const isJPG = file.type === "image/jpg";
  const isPng = file.type==="image/png";
      if (!isJPG && !isPng) {
        this.$message({
          message: "上传文件只能是.jpg,.png格式!",
          type: "warning",
        });
        return false
      }
      return true;
    },

那么在选择其他类型的文件后就会触发提示并且没法提交

赏