cube-ui限制图片上传类型以及上传大小

最新推荐文章于 2023-02-14 22:14:45 发布

HongHamster

最新推荐文章于 2023-02-14 22:14:45 发布

阅读量403

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/HongHamster/article/details/127717658

版权

/移动端
<cube-upload
    ....
    @files-add="addedHandler"
    ....>
    
    methods:{
        addHandler(files){
            //限制图片大小最大为7M
            const maxSize = 7*1024*1024
            for(let k in files){
                if(files.hasOwnProperty(k)){
                    const file = files[k]
                    if(file.size > maxSize){
                        file.ignore = true
                        this.createToast({
                            type:'error',
                            time: 2000,
                            txt: '上传图片超过7M上限'
                        }).show()
                        return
                    }
                    //获取图片类型名
                    let img = file.name.substring(file.name.lastIndexOf('.')+1)
                    if(!['jpg','jpeg','png'].includes(img)){
                        file.ignore = true
                        this.$createToast({
                          type:'error',
                          time: 2000,
                          txt: '上传图片仅支持PNG、JPG、JPEG格式'
                        }).show()
                        return
                    } 
                }
            }
        }
    }