reactjs - 回调函数的返回值
问题描述
我在通过回调函数(“dist”= undefined)获取返回值时遇到了一些麻烦......我已经尝试了很多次但仍然未定义。但是,我可以从控制台获取它....请一些机构可以提供帮助!
calculateDistance = (place, me) => {
var origin = new window.google.maps.LatLng(
parseFloat(place.latitude)
parseFloat(place.longitude)
);
var destination = new window.google.maps.LatLng(
parseFloat(me.latitude),
parseFloat(me.longitude)
);
var service = new window.google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: [origin],
destinations: [destination],
travelMode: window.google.maps.TravelMode.DRIVING,
avoidHighways: false,
avoidTolls: false,
unitSystem: window.google.maps.UnitSystem.metric
},
function(response, status) {
if (
status === "OK" &&
response.rows[0].elements[0].status !== "ZERO_RESULTS"
) {
let dist = parseFloat(response.rows[0].elements[0].distance.text);
return dist;
} else {
alert("Error: " + status.toString());
}
}
);
};
解决方案
你不能强制谷歌的函数返回你的回调值,所以你能做的最好的就是从你的回调中调用另一个函数。
const setDist = (dist) => {
//persist your dist somehow, maybe setState?
this.setState({distance: dist});
}
service.getDistanceMatrix(
{
origins: [origin],
destinations: [destination],
travelMode: window.google.maps.TravelMode.DRIVING,
avoidHighways: false,
avoidTolls: false,
unitSystem: window.google.maps.UnitSystem.metric
},
function(response, status) {
if (
status === "OK" &&
response.rows[0].elements[0].status !== "ZERO_RESULTS"
) {
let dist = parseFloat(response.rows[0].elements[0].distance.text);
setDist(dist);
} else {
alert("Error: " + status.toString());
}
}
);
推荐阅读
- python - 将 Flatten CSV 转换为嵌套 JSON
- html - CSS calc() 不能使 td 元素居中
- python - 如何在 Python 中拆分字符串以仅使用中间字符?
- java - java中分隔符参数中带括号的stringtokenizer的含义
- redis - 如何停止 redis 内存使用量随着连接数的增加而增加
- azure - 使用 terraform 抛出错误创建 SQL 虚拟机
- flutter - 在Flutter中向下滚动时在appbar中创建一个变成图标的搜索?
- javascript - 在控制台日志中隐藏特定警告
- r - 如何在 zoo 包中的 na.aggregate() 中使用多个因子
- amazon-web-services - 在本地计算机上使用来自 Amazon Sagemaker 的标记数据,而无需进一步依赖 AWS