javascript - “不是函数”错误;尝试使用 Geolocation API 和 Weather API
问题描述
我在通过天气 API 的异步获取函数传递用户位置时遇到问题。
代码
let lat = "48.8566";
let long = "2.3522";
const fetchWeatherData = (async (lat, long) => {
const response = await fetch(
" http://api.weatherstack.com/current?access_key={API_KEY}query=" + lat + "," + long
).then(resp => resp.json()).then(
function(apiResponse) {
console.log(`Current temperature in ${apiResponse.location.name} is ${apiResponse.current.temperature}℃`);
}
);
return await console.log(response.json());
})();
function setUserLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(setPosition);
console.log("click on button worked");
} else {
alert("location api not supported by browser");
}
}
function setPosition(position) {
lat = position.coords.latitude;
long = position.coords.longitude;
fetchWeatherData.response(lat, long);
console.log("Lat: " + lat + " and Long:" + long);
}
我已尝试更改该功能fetchWeatherData.response(lat, long);
,但仍然无法解决该错误fetchWeatherData.response() is not a function at setPosition
。我不确定我的错误是来自函数调用,还是来自其他地方,例如async (lat, long) => ...
.
我能够获取用户位置,但是当我尝试在异步函数中传递新的 lat 和 long 作为参数时,我的问题就开始了。
有没有更好的方法来解决这个问题?
解决方案
你有一个奇怪的组合.then
并await
继续,尽量不要混合方法:
let lat = "48.8566";
let long = "2.3522";
const fetchWeather = async (lat, long) => {
const response = await fetch(
" http://api.weatherstack.com/current?access_key={API_KEY}query=" + lat + "," + long
)
const apiResponse = await response.json();
console.log(`Current temperature in ${apiResponse.location.name} is ${apiResponse.current.temperature}℃`);
return data
}
function setUserLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(setPosition);
console.log("click on button worked");
} else {
alert("location api not supported by browser");
}
}
function setPosition(position) {
lat = position.coords.latitude;
long = position.coords.longitude;
fetchWeather(lat, long);
console.log("Lat: " + lat + " and Long:" + long);
}
推荐阅读
- java - 将 .class 文件转换为 .dex 文件时出现问题
- asp.net-core - EF6 CLI 工具无法从用户机密 .net 核心读取连接字符串
- azure - 如何使用 api/azure-cli/powershell/terraform 创建 Azure Marketplace SaaS 应用程序?
- vue.js - 无法创建 Vue 项目,收到错误消息“'vue' 不是内部或外部命令、可运行程序或批处理文件。”
- javascript - Chrome 扩展在图标上打开新标签点击
- java - 如何记录 Spring JDBC DataSourceTransactionManager 的事务开始、提交和回滚?
- android - 在 Admob 20.1.0 中永远不会调用 onUserEarnedReward
- unity3d - 刚打开统一项目后,存储库中出现意外更改
- react-query - 反应查询和选择器和架构
- cycle - 指令周期示例(不需要所有指令周期步骤)