v-for を使用して vuetify でオブジェクトの値を表示しようとしました

Question

Vue.js で関数を構築しています。この関数では、ユーザーがデータベース内のいくつかのテーブルを選択でき、テーブルの列名が v-list-item コンポーネントに自動的に表示されます。 問題は、これらの列名を適切な方法で印刷できないことです。

これは私が使用したコードです:

<v-list-item v-for="(item,index) in this.columns" :key="index">
  <v-list-item v-for="アイテムに登録済み" :key="ved.id">
    <v-list-item-content>
      <v-list-item-title >{{ved}}</v-list-item-title>
    </v-リストアイテムコンテンツ>
  </v-リストアイテム>
</v-リストアイテム>

<スクリプト>
  デフォルトのエクスポート {
    データ（） {
      戻る {
        列:{}、
      };
    }、
  }
</script>

コードをわかりやすくするために、メソッドやその他の変数は含めていません。

たとえば、データベース内で 2 つのテーブル (1 つは 1 列のみ、もう 1 つは 3 列) を選択した場合、このコードから得られる結果は次のようになります。

<ブロック引用>

id //最初のテーブルの列

<ブロック引用>

name, last_name,email // 2 番目のテーブルの列

しかし、2 番目のテーブルの列を同じ行内でカンマで区切るのではなく、別々に印刷したいと考えています。 私が望む結果は次のとおりです (数値は含まれません):

1. id //最初の列
2. name //2 列目
3. 姓
4. メール

これは axios リクエストから得られた結果です:

<ブロック引用>

[ [ 「ID」 ]、 [ "名前"、 "姓"、 "Eメール" ] ]

Answer 1

2 つの配列をリスト として扱い、 項目をリスト項目として扱うことができます

リーリー