vue中将图片转为base64码(笔记)

  

        <img src="" alt="" ref="demoImg">

        <input type="file" ref="file" name="file" @change="demo">


        demo(e){    //预览图片 并将图片转为base64码传给后台 

            let file = e.target.files[0]

            let reader = new FileReader()

            if(file.type == 'image/jpg'){

                this.$message.error('上传头像图片只能是 jpg 格式!');

                this.$refs['file'].value = ''

                return

            }

            if(file.size/1024/1024 < 2){

                this.$message.error('上传头像图片大小不能超过 2MB!');

                this.$refs['file'].value = ''

                return

            }

            reader.readAsDataURL(file)    //将结果转为url,使得img的src可以使用

            reader.onload = (e) => {

                console.log(e.target.result)                

                console.log(e.target.result.split(',')[1])  //图片的base64码

                this.$refs['demoImg'].src = e.target.result;//转为url后的结果 赋给img的src

            }

        }

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。