Question

我有一个变量，我在其上存储地址。我想把它传递到谷歌地图静态api：

像这样

adr = comp.adress; 
console.log(adr);// 28, rue Armand Carrel

<img src="https://maps.googleapis.com/maps/api/staticmap?center={adr}&amp;size=600x300" alt="exemple" />

我没有得到adr的价值代码有什么问题？

处理空间

 "addr": "\n                \n                28, rue Armand Carrel \n              ",

谢谢

Answer 1

你在做什么只是阅读{adr}作为你的一部分。

假设上述内容位于React / ES6 / ES2015。

您需要将其连接到字符串：

<img src={"https://maps.googleapis.com/maps/api/staticmap?center=" + adr + "&amp;size=600x300"} alt="exemple" />`

或者您可以使用template literals：

<img src={`https://maps.googleapis.com/maps/api/staticmap?center=${adr}&amp;size=600x300`} alt="exemple" />`

Answer 2

该问题与reactjs无关。

您需要对地址进行编码（使用encodeURIComponent()），以便它成为有效的网址。像这样：

//var address = '28, rue Armand Carrel';
var address = "\n                \n                28, rue Armand Carrel \n";
document.body.innerHTML = '<img src="https://maps.googleapis.com/maps/api/staticmap?center=' + encodeURIComponent(address) + '&amp;size=600x300" alt="exemple" />';

如果您想重新格式化地址：

var address = "\n                \n                28, rue Armand Carrel \n";
console.log(address.replace(/\n/g, '').trim());

将变量传递给静态Google图片地图

2 个答案: