Javascript 如何从API读取图像数据并在React组件中渲染

我正在尝试从Webservice渲染图像数据，并能够获得如下所示的数据

我尝试读取的图像数据如下，但图像未显示

getImageFromDrive = (path) => {
    let that = this;
    axios.get(Constants.API + Constants.Files, {
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            "Authorization": Constants.AUTH_Element + ',' + Constants.AUTH_ORG + ',' + Constants.AUTH_USER
        },
        params: {
            path: path
        }
    }).then(function (response) {
        var myThat =that;
        console.log(response);
        let data = response.data;
        var base64Flag = 'data:image/jpeg;base64,';
        var imageStr =
            that.arrayBufferToBase64(data.img.data.data);
        that.setState({img: base64Flag + imageStr});

    })
        .catch(function (error) {
            console.log(error);
        })
}
arrayBufferToBase64(buffer) {
    var binary = '';
    var bytes = [].slice.call(new Uint8Array(buffer));
    bytes.forEach((b) => binary += String.fromCharCode(b));
    return window.btoa(binary);
};

render() {
    const {img} = this.state;

    return (

        <img className="myImg" alt="" width="300"
             height="300"  src={img}/>
     )
    }

getImageFromDrive=（路径）=>{
让那=这；
获取（Constants.API+Constants.Files、{
标题：{
“接受”：“应用程序/json”，
“内容类型”：“应用程序/json”，
“授权”：Constants.AUTH_Element+'、'+Constants.AUTH_ORG+'、'+Constants.AUTH_USER
},
参数：{
路径：路径
}
}).然后（功能（响应）{
var myThat=该值；
控制台日志（响应）；
让data=response.data；
var base64Flag='数据：图像/jpeg；base64'；
var-imageStr=
arrayBufferToBase64（data.img.data.data）；
setState（{img:base64Flag+imageStr}）；
})
.catch（函数（错误）{
console.log（错误）；
})
}
arrayBufferToBase64（缓冲区）{
var二进制=“”；
var bytes=[].slice.call（新的Uint8Array（缓冲区））；
bytes.forEach（（b）=>binary+=String.fromCharCode（b））；
返回窗口.btoa（二进制）；
};
render（）{
const{img}=this.state；
返回(
)
}

有人能告诉我如何读取此类数据并显示吗？请尝试下面的代码

export async function getImageData() {
        await axios.get(`your api url`, {responseType: 'arraybuffer'}).then((data) => {
            const b64Data = btoa(
                new Uint8Array(data.data).reduce(
                    (dataArray, byte) => {
                        return dataArray + String.fromCharCode(byte);
                    }, 
                    ''
                )
            );
            const userAvatarData = {
                key: 'userAvatar',
                value: `data:image/png;base64,${b64Data}`
            };
            return userAvatarData.value; // here we return the base64 image data to our component
        });
}