axios获取图片显示_如何显示从axios请求返回的图像（反应）？

最新推荐文章于 2024-07-12 04:24:57 发布

硬核拆解

最新推荐文章于 2024-07-12 04:24:57 发布

阅读量1.2k

点赞数

文章标签： axios获取图片显示

本文链接：https://blog.csdn.net/weixin_28878287/article/details/111924926

版权

在React谷歌地图项目中，作者使用axios从API获取街景图片URL并设置到状态中，然后传递给子组件显示。文章讨论了两种方法：直接使用URL和将响应转换为base64。作者询问了使用当前方法是否合适，以及是否有必要进行base64转换。结论是，如果API返回的是图片URL，那么直接使用URL的方法是正确的。

摘要由CSDN通过智能技术生成

I'm working on a google maps project with React. I assign an onClick handler the following method:

getStreetView(lat,lng){

let url = `https://maps.googleapis.com/maps/api/streetview?size=600x300&location=${lat},${lng}&heading=151.78&pitch=-0.76&key=MYAPIKEY`

axios.get(url).then(response=>this.setState({image:response.config.url}));

}

the state = { image: null } is then beeing assigned the url which I later pass on to an image tag to a child component such as street view . Everything works like a charm, however I have come across various other solutions such:

function getBase64(url) {

return axios

.get(url, {

responseType: 'arraybuffer'

})

.then(response => Buffer.from(respon