Vue.jsでHTMLに出力する際の{{}}の中身を変数にしたい

Question

前提・実現したいこと

Vue.jsの学習をしています。
Vueのデータの内容を下記のようにHTMLに出力するとします。

<p>{{this.comments[this.commentNumber].comment}}</p>

その際に、

this.comments[this.commentNumber]

の部分を何らかの形で変数に格納し(newValue)、

{{newValue.comment}}

のような形で表現することは可能ですか？

どうしても、たくさんの場面で　this.comments[this.commentNumber]　を使った際にコードが冗長になってしまうので、解決策を探しています。
もしありましたらご教授いただけると幸いです。

Answer 1

computedを使えばできるかと思います。

computed: {
  newValue(){
    return this.comments[this.commentNumber];
  }
}

Comments

[HORIZONium]

ありがとうございます！
上手くいきました！