获取数组VueJS的最后一项

Posted 2023-02-22

【中文标题】获取数组VueJS的最后一项

【英文标题】：Get the last item of an array VueJS

【发布时间】：2017-09-29 19:48:04

【问题描述】：

我正在开发一个小型 VueJS webapp。我想将数据从我的数组输出到视图，但它必须是数组的最后一项，而最后一项的第二项是 a，在我的示例中等于 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的那一行

【参考方案1】：

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

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

【讨论】：

我需要在数组中获取特定的“a”。所以不是整个项目，而只是“39”。我的问题会更具体。

太棒了！搞砸了这么久，但答案很容易......谢谢:)

【参考方案2】：

Ypu 可以使用普通的 javascript 来做到这一点

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

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

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