Question

我想通过在计算属性中定义的函数"1999-00"获取stateStats的值（它是xyz()数据属性的一部分），但我无法这样做。

有人对此有想法吗？

var app = new Vue({
  el: "#app",
  data(){
    return {
    stateStats : [{"State":"Andaman & Nicobar Islands","1999-00":"45"},
                             {"State":"Andhra Pradesh","1999-00":"27"},
                             {"State":"Arunachal Pradesh","1999-00":"9"}]
            }
        },
    computed:{
        xyz(){
          return this.stateStats['1999-00']
        }
    }
  })

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<div v-for="x in xyz">
{{x}}
</div>
</div>

Answer 1

computed属性应与数据处于同一级别。

var app = new Vue({
  el: "#app",
  data(){
     return {/* whatever */}
  },
  computed : {
        xyz(){
          return this.stateStats.map( s => s['1999-00']);
        }
    }
});

Answer 2

您可以使用数组map函数从对象数组中获取所需的属性。

var app = new Vue({
  el: "#app",
  data(){
    return {
    stateStats : [{"State":"Andaman & Nicobar Islands","1999-00":"45"},
                             {"State":"Andhra Pradesh","1999-00":"27"},
                             {"State":"Arunachal Pradesh","1999-00":"9"}]
            }
        },
    computed:{
        xyz(){
          return this.stateStats.map(state => state["1999-00"]);
        }
    }
  })

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<div v-for="x in xyz">
{{x}}
</div>
</div>

为什么我无法使用v-for获得价值？

2 个答案: