Vue.js，如何通过函数获取嵌套json文件的纬度和经度列表

Question

如果我使用getcoords((，总是只返回所有数组长度的第一个纬度和经度。

如果我使用正常语法｛｛fire.titude｝｝，则｛{fire.titude}｝返回所有纬度和经度。

我不知道为什么，可能是一件很简单的事情

这是我写的第一个问题，我希望能弄清楚。谢谢大家的帮助。

<template>
<div>
<div v-for="(fire, index) in fires" :key="index">
<!-- {{index}}.{{getCoords()}} -->
{{fire.lat}},{{fire.lon}}
</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: 'FiresList',
data () {
return {
fires: null,
errored: false,
}
},
mounted () {
axios.get('https://storage.googleapis.com/public.storykube.com/start2impact/fires.json')
.then(response => {
this.fires = response.data.map((coords)=> {
return {lat: coords.latitude, lon: coords.longitude, date: coords.date}
})
console.log(this.fires);
})
.catch(error => {
console.log(error)
this.errored = true
})
},
methods: {
getCoords (){
for (var latlon in this.fires){
return [this.fires[latlon].lat, this.fires[latlon].lon]
//OTHERWISE
// for (let i = 0; i <= this.fires.length; i++){
// return [this.fires[i].lat, this.fires[i].lon]
}
}
}
}
</script>
<style scoped>
</style>

Answer 1

我想你想要的是：

<div v-for="(fire, index) in fires" :key="index">
{{index}}.{{getCoords(index)}}
</div>

getCoords(index) {
return [this.fires[index].lat, this.fires[index].lon]  
}