图片转base64格式

// 图片转base64
    getBase64() {
        var Img = new Image();
        Img.crossOrigin = "Anonymous";//跨域必须使用，且后台也得设置允许跨域
        let Base64URL = '';
        Img.src = require("../../assets/images/map.png");// 我这里取的是我本地图片
        Img.onload = () => { //要先确保图片完整获取到，这是个异步事件
            var canvas = document.createElement("canvas"), //创建canvas元素
                width = Img.width, //确保canvas的尺寸和图片一样
                height = Img.height;
            canvas.width = width;
            canvas.height = height;
            canvas.getContext("2d").drawImage(Img, 0, 0, width, height); //将图片绘制到canvas中
            Base64URL = canvas.toDataURL('image/jpg'); //转换图片为dataURL
            console.log("Base64URL", Base64URL)
            
            return Base64URL
        };
    }

拿到base64直接赋值给img标签src即可

 <img src={getBase64()} alt="" />