如何在类星体表中映射我的 JSON 数据文件的结果？

Question

我实际上是 VueJS 学生，我似乎无法返回从我的 JSON 文件到表的距离。 请通过步行和驾驶返回“5”、“10”...的所有数据的最佳做法是什么？

this.concurrentsRows = JSON.parse(result.data.result.iso.driving[i].poi[j].distance) ???

如何定义 i 和 j ？

我的文件 VueJS（类星体）：

<template>
 <div>
  <SimpleTableFirstCell
    :loading="loading"
    :columns="concurrentsColums"
    :rows="concurrentsRows"
    :title="Concurrents List"
  />
 </div>
</template>

<script>
import { defineComponent, ref } from 'vue'
import axios from 'axios'

import SimpleTableFirstCell from 'src/components/SimpleTableFirstCell.vue'

export default defineComponent({
  name: 'Concurrents',

  components: {,
    SimpleTableFirstCell
  },
  data () {
    return {
      concurrentsColums: [
        {
          name: 'distance',
          label: 'Distance',
          field: 'distance',
        },
        {
          name: 'latitude',
          label: 'Latitude',
          field: 'latitude',
        },
        {
          name: 'longitude',
          label: 'Longitude',
          field: 'longitude',
        }
      ],
      loading: ref(false),

      concurrentsRows: ref([]),
    }
  },
  methods: {
    concurrentsData () {
     
        axios.get('https://url...')
         .then(result => {
           this.loading = true
           this.concurrentsRows = JSON.parse(result.data.result)
         .finally(() => {
           loading.value = false
         })
    }
   }
  })
</script>

我的JSON：

[
  {
    "iso": {
      "driving": {
        "5": {
          "poi": [
            {
              "distance": 1.67168887573,
              "latitude": "50.415",
              "longitude": "2.990",
            },
            {
              "distance": 3.68833575679,
              "latitude": "50.403",
              "longitude": "3.031",
            },
          ],
        },
        "10": {
          "poi": [
            {
              "distance": 2.40512340917,
              "latitude": "50.412",
              "longitude": "2.977",
            },
            {
              "distance": 2.11846991875,
              "latitude": "50.417",
              "longitude": "2.975",
            },
          ],
        },
      },
      "walking": {
        "5": {
          "poi": [
            {
            "distance": 3.68833575679,
            "latitude": "50.403",
              "longitude": "3.031",
            }
          ],
        },
      }
    }
  }
]

Answer 1

i和j通常用于for循环。 一个简单的：

let arr = [2, 4, 8];
for(let i=0; i < arr.length; i++) {
  console.log(i, arr[i]);
}

在您的情况下，您可以在for循环中使用for循环。

let arr = [[1,2,3], [2,4,8], [-1,-1]];
for(let i=0; i<arr.length; i++) {
  for(let j=0; j<arr[i].length; j++) {
    console.log(i, j, arr[i][j]);
  }
}

同样，可以使用for...in遍历对象。 这里的例子：

const object = { a: 1, b: 2, c: 3 };

for (const property in object) {
  console.log(`${property}: ${object[property]}`);
}

看

• 用于文档的 JavaScript
• JavaScript for...in 文档