Question

我正在开发一个小型的VueJS webapp。我想从我的数组输出数据到视图，但它必须是数组的最后一项，而最后一项是第二项是一个，在我的例子中等于39.我不知道我怎么能收到那一个。

HTML

<p>The last number in the array (a) is {{userLastCount}} </p>

使用Javascript / Vue公司

data () {
    return {

        event: 'Custom event',
        userLastCount: 0,


        lineData: [
            { time: '2017-05-01 15:00', a: 0 },
            { time: '2017-05-01 16:00', a: 12 },
            { time: '2017-05-01 17:00', a: 23 },
            { time: '2017-05-01 18:00', a: 28 },
            { time: '2017-05-01 19:00', a: 39 },
        ]

    }
},

components: {
    DonutChart, BarChart, LineChart, AreaChart
},

created() {
    this.userLastCount = //equal to 39
}

我想输出lineData对象的'a'的最后一个值，并将其分配给我可以输出到视图的数据字符串。所以，现在最后一个'a'= 39.但是如果我在我的对象中添加另一行它必须是那个分配给this.userLastCount的那个

Answer 1

数组的最后一项是arr[arr.length - 1]。您可以使用computed始终为您设置该值，而不是自己维护数据项：

computed: {
  userLastCount() {
    return this.lineData[this.lineData.length - 1].a;
  }
}

Answer 2

Ypu可以做这个uzing plain javascript

在created()挂钩中执行以下操作：

created(){
   //get the position of last object in the array.
    var lastPosition = this.lineData.length -1;

    this.userLastCount = this.lineData[lastPosition].a;
}

获取数组VueJS的最后一项

2 个答案: