Vue.jsで、JSONの配列に入っている文字列のHTML要素をtemplateに差し込みたい

Question

表題の通り、JSONの配列に入っている文字列のHTML要素をtemplateに差し込みたいと考えています。
やりたいことは以下のような感じです。
template内の「ここにHTMLArrayの内容を差し込みたい」というコメント部分をどう書けば良いのか、というところになります。

<template>
  <v-container>
    <v-row
      v-for="item in HTMLArray"
      v-bind:key=item.id
    >
      <!-- ここにHTMLArrayの内容を差し込みたい -->
    </v-row>
  </v-container>
</template>

<script>
import Vue from "vue"

export default Vue.extend({

  data(){
    return{
      HTMLArray: [
        {
          "id":1,
          "content":"<p>1行目</p>"
        },
        {
          "id":2,
          "content":"<p>2行目</p>"
        },
        {
          "id":3,
          "content":"<p>3行目</p>"
        }
      ]
    }
  },

})
</script>

dataのHTMLArrayに格納されたHTMLArray配列は、オブジェクトのcontentという要素で画面上に表示したいHTMLを文字列として保持しています。
これが最終的に↓のような感じに組み立てられると良いかなと思っています。

<template>
  <v-container>
    <v-row>
      <p>1行目</p>
    </v-row>
    <v-row>
      <p>2行目</p>
    </v-row>
    <v-row>
      <p>3行目</p>
    </v-row>
  </v-container>
</template>

試しに、単純に以下のように書いてみたのですが、HTMLとしてではなくただの文字列として画面表示されてしまいました。
※template部分のみ記載

<template>
  <v-container>
    <v-row
      v-for="item in HTMLArray"
      v-bind:key=item.id
    >
      {{item.content}}
    </v-row>
  </v-container>
</template>

何かうまいやり方があれば、ヒントなど頂けますと幸いです。
よろしくお願いいたします。

Answer 1

v-htmlとかではダメですか？

  <v-container>
    <v-row
      v-for="item in HTMLArray"
      :key="item.id"
      v-html=" item.content" />
  </v-container>

Comments

[akabee]

遅くなってしまい申し訳ございません。
動作確認できました。
早速のご回答ありがとうございました。