时间戳

首页 > 解决方案 > 如何使用带有模板文字的 JSON 数组？

javascript - 如何使用带有模板文字的 JSON 数组？

问题描述

我正在学习 javascript 并使用 Fetch 从 URL 中检索和解析一些 JSON。控制台记录 JSON 数组，但是当我尝试在模板文字中使用它时，控制台中出现错误"positions is not defined"。这就是我被挂断的地方，因为大多数示例和教程都没有按照我的获取方式显示 JSON 格式。

我将如何访问它，以便我可以在模板文字中以我想要的方式使用它，或者有更好的方法吗？我不想循环遍历它，因为我希望能够将某些值放在我需要或想要的地方。

我正在使用的代码示例：

let positionData = new Request('URL_TO_JSON')

  fetch(positionData)
    .then(function(response){
        return response.json();
    })
    .then(function(json){

        document.getElementById('online').innerHTML = `THERE ARE CURRENTLY ${positions.lenght} CHASERS LIVE`;

        document.getElementById('name').innerHTML = `${positions[0].name}`;

        console.log(json)
    })
    .catch(function(err) {
        console.log(`Error: ${err}` )
      });

在控制台中，它显示 JSON 数组，如下所示：

{positions: Array(2)}
positions: Array(2)
0: {report_at: "2019-04-26 20:29:29", lat: "33.0851707", lon: "-96.8177032", elev: "0", dir: "0", …}
1: {report_at: "2019-04-26 05:07:29", lat: "33.0173721", lon: "-96.5511093", elev: "0", dir: "0", …}
length: 2
__proto__: Array(0)
__proto__: Object

根据我一直在观看的教程和视频，我需要做的就是这个，我认为这是我的问题所在，因为 JSON 的前缀是Positions. 

document.getElementById('name').innerHTML = `${positions[0].name}`;

但是我在控制台中收到“未定义位置”错误。

标签： javascriptarraysjsonfetch

解决方案

您的数据json包含在其中positions，因此您应该说：

document.getElementById('online').innerHTML = `THERE ARE CURRENTLY ${json.positions.length} CHASERS LIVE`;`

document.getElementById('name').innerHTML = `${json.positions[0].name}`;

注意也lenght应该拼写length:-)

推荐阅读