element-UI上传组件限制上传文件类型和文件大小

element-UI 使用Upload组件上传文件，我们有时候需要设定类型和文件的最大值。如何来操作呢？zjcopy来说明一下

<el-upload 
           :action="actions" 
           accept=".jpg,.jpeg,.png,.gif,.bmp,.pdf,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF" 
           :on-exceed="onExceed" 
           :on-success="onSuccess" 
           :before-upload="beforeUpload" 
            > 
 <el-button slot="trigger" size="small" >选取文件</el-button> 
</el-upload> 

这里可以看到accept=".jpg,.jpeg,.png,.gif,.bmp,.pdf,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF" ，他的目的是选文件的时候，会把这些类型显示出来。你还是可以选择全部文件，然后上传别的类型的文件。这就说明，accept控制不了我们上传文件的类型。 如何解决呢？

上传之前:before-upload="beforeUpload"再次判断文件类型

beforeUpload(file) {                 
                var testmsg=file.name.substring(file.name.lastIndexOf('.')+1)                
                const zjcopy1 = testmsg === 'jpg' 
                 const zjcopy2 = testmsg === 'gif' 
                const isLt10M = file.size / 1024 / 1024 < 10 
                if(!zjcopy1 && !zjcopy2) { 
                    this.$message({ 
                        message: '上传文件只能是 jpg、gif格式!', 
                        type: 'warning' 
                    }); 
                } 
                if(!isLt2M) { 
                    this.$message({ 
                        message: '上传文件大小不能超过 10MB!', 
                        type: 'warning' 
                    }); 
                } 
                return zjcopy1 || zjcopy12 && isLt10M 
            }