首页 > 解决方案 > 如何使用 javascript 从 api 读取 JSON 数据

问题描述

之后的结果您好,我正在尝试从 api 读取 JSON 数据,但是当我尝试从该 api 获取数据时它不起作用,当我尝试获取距离值时,我得到未定义。请帮助

编码

fetch('https://maps.googleapis.com/maps/api/distancematrix/json?units=meter&origins=Gurd%20Shola%201%20Station,%20Addis%20Ababa&destinations=Bole%20Medhane%20Alem%20Church,%20Addis%20Ababa&key=API_KEY')
  .then(response => {
    return response.json()
  })
  .then(data => {
// Work with JSON data here
console.log(data.rows.elements.distance.value)
 })
  .catch(err => {

 })

网上的结果是这样的

{
   "destination_addresses" : [ "Addis Ababa, Ethiopia" ],
   "origin_addresses" : [ "Addis Ababa, Ethiopia" ],
   "rows" : [
      {
         "elements" : [
            {
               "distance" : {
                  "text" : "6.4 km",
                  "value" : 6386
               },
               "duration" : {
                  "text" : "15 mins",
                  "value" : 901
               },
               "status" : "OK"
            }
         ]
      }
   ],
   "status" : "OK"
}

标签: javascriptjson

解决方案


改为.. data.rows.elementes.distance.value_data.rows[0].elements[0].distance.value

检查这里的错字elements不是 elementes..

还有rowsandelements是一个数组,如果你需要得到距离,那么你需要得到它,比如rows[0].elements[0].distance..

const data = {
   "destination_addresses" : [ "Addis Ababa, Ethiopia" ],
   "origin_addresses" : [ "Addis Ababa, Ethiopia" ],
   "rows" : [
      {
         "elements" : [
            {
               "distance" : {
                  "text" : "6.4 km",
                  "value" : 6386
               },
               "duration" : {
                  "text" : "15 mins",
                  "value" : 901
               },
               "status" : "OK"
            }
         ]
      }
   ],
   "status" : "OK"
}

console.log(data.rows[0].elements[0].distance);


推荐阅读