为什么从网站获取信息时数据没有正确显示

Question

我目前正在编写一个天气应用程序(为了好玩(，它可以获取用户的经度和纬度(经过许可(，然后显示当前天气。不幸的是，控制台中没有正确记录天气数据。如有任何帮助，我们将不胜感激！谢谢

const api = "API---";

window.addEventListener('load', () => {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition((position) => {
let lat = position.coords.latitude;
let lon = position.coords.latitude;
let data = `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lon}&appid=${api}`;
console.log(lat, lon, data);
fetch(data)
.then((r) => {
return r.JSON;
})
.then((data) => {
console.log(data);
})
});
};
});

不是记录天气，而是记录

ƒ json() { [native code] }

我正在使用开放天气，但API密钥不会公开显示。谢谢你的帮助！

Answer 1

您的问题就在这里：return r.JSON

根据MDN Web文档，.json()函数是函数。你需要括号来调用它，就像任何其他函数一样。如果将该行更改为return r.json();，它应该可以工作。我用我的API密钥进行了测试(尽管没有你拥有的navigator.geolocation(，这对我有效

至于为什么您看到ƒ json() { [native code] }，那是因为您返回了一个实际的函数。因此，当您console.log返回值时，它显示的是函数，而不是您想要的数据。

换句话说，这里的问题似乎是拼写错误，忘记在函数调用中包含括号。包括括号应该可以解决您的问题。

Answer 2

输出是这样的，因为您正在返回r.JSON，这是一个函数，因此秒中的数据是

ƒ json() { [native code] }

应该是

fetch(data)
.then((r) => {
return r.json();
})
.then((data) => {
console.log(data);
});

json是正确的函数，它将json响应解析为本地JavaScript对象，并返回一个promise，该promise使用与响应对应的JavaScript对象进行解析