鍍金池/ 問答/HTML/ element-ui的圖片上傳怎么限制格式？

element-ui的圖片上傳怎么限制格式？

HTML代碼:

    <el-upload
        style="width:300px;"
      ref="upload"
      class="upload-demo"
        :action="actionPath"
        :headers="myHeaders"
        :data="form"
        :show-file-list="true"
        :on-change="changeFileList"
        :on-success="successMethod"
        :on-remove="removeHandle"
        :on-error="errorMethod"
        :multiple="true"
        :before-upload="beforeAvatarUpload">

js代碼：

methods: {
    beforeAvatarUpload(file) {
      const isJPG = file.type === 'image/jpeg';
      if (!isJPG) {
          this.$confirm('上傳圖片暫時只支持JPG格式', '提示', {
            confirmButtonText: '確定',
            cancelButtonText: '取消',
            type: 'error' ,
            callback: action => {
              this.$refs.form.resetFields();

              this.$emit('closeEditUpload');
            }
          })
      }
      return isJPG;
    },
   }
   
 現(xiàn)在只能上傳jpg格式，我想上傳jpg和png，怎么限制？？？
回答
編輯回答
葬憶

accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"

不用謝，往哪兒寫就不用我說了吧

2018年4月20日 23:11
編輯回答
你的瞳

正則即可

methods: {
    beforeAvatarUpload(file) {
      if (!/^image\/(jpeg|png)$/.test(file.type)) {
          this.$confirm('上傳圖片暫時只支持JPG格式', '提示', {
            confirmButtonText: '確定',
            cancelButtonText: '取消',
            type: 'error' ,
            callback: action => {
              this.$refs.form.resetFields();

              this.$emit('closeEditUpload');
            }
          })
      }
      return isJPG;
    },
   }
if (!/^image\/(jpeg|png)$/.test(file.type)) {
    // do something
}
2017年1月31日 15:14
編輯回答
命于你
        <el-upload class="upload-demo" :multiple="true" :action="action" accept="image/jpeg,image/gif,image/png,image/bmp" :file-list="fileList" :before-upload="beforeAvatarUpload" :on-success="handleAvatarSuccess">

beforeAvatarUpload(file) {

            this.imageFileName.push(file.name);
            const isJPG = file.type === 'image/jpeg';
            const isGIF = file.type === 'image/gif';
            const isPNG = file.type === 'image/png';
            const isBMP = file.type === 'image/bmp';
            const isLt2M = file.size / 1024 / 1024 < 2;

            if (!isJPG && !isGIF && !isPNG && !isBMP) {
                this.common.errorTip('上傳圖片必須是JPG/GIF/PNG/BMP 格式!');
            }
            if (!isLt2M) {
                this.common.errorTip('上傳圖片大小不能超過 2MB!');
            }
            return (isJPG || isBMP || isGIF || isPNG) && isLt2M;
        },
2018年8月5日 11:30
編輯回答
嫑吢丕
const isJPG = file.type === 'image/jpeg'||file.type === 'image/png'

或

const isJPG = (file.type.indexOf('image')==0)&&(/\.(?:jpg|png)$/.test(file.name))
2017年8月24日 22:14