配列の最後の項目を取得するVueJS

Question

私は小さなVueJS webappで作業しています。私はビューに配列からデータを出力したいのですが、配列の最後の項目とその最後の項目の2番目の項目は、私の例では39になります。私はどのようにできるのでしょうかそれを受け取ります。私は、出力線データオブジェクトの「A」の最後の値をしたいとしている私はへの出力を可能なデータ列に割り当てます

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 
} 

景色。したがって、最後の 'a' = 39です。オブジェクトに別の行を追加すると、それは割り当て先のものでなければなりません。this.userLastCount

Answer 1

最後の配列はarr[arr.length - 1]です。あなたは、むしろデータ項目を自分で維持するよりも、いつもあなたのために設定され、その値を持つようにcomputedを使用することができます。

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

Answer 2

Ypuは、次のようにあなたのcreated()フックで

を行うjavascriptのこのuzing平野行うことができます。

を

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

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