vue.js - Vueでテーブルの行名と列番号を取得するには?

Question

vue を使用してテーブルの列番号または位置と行ヘッダーを取得する方法はありますか?

ここまでのアウトプットはこんな感じ。

テーブルを生成するコード:

<table v-if="this.itemList.length > 0">
                    <thead class="ui-table-header-row">
                        <tr>
                            <th class="ui-table-header-cell l-padding"></th>
                            <th class="ui-table-header-cell center"  v-for="item in 31" :key="item.id">{{thisMonth}} July{{ item }}Day</th>

                        </tr>
                    </thead>
                        <template>
                            <tr>
                                <td></td>
                            </tr>
                            <tbody style="border-bottom:#dbb100 1px"  v-for="(item,index) in itemList" :key="index.id" >
                                <tr class="left-align">
                                    <td>{{item.name}}</td>
                                    <td v-for="(item,index) in costList" :key="index.id">{{item.total_work}}</td>
                                </tr>
                             </tbody>
                       </template>
</table>

この行では、値を表示する前に、最初に行ヘッダー名が my in<td v-for="(item,index) in costList" :key="index.id">{{item.total_work}}</td>と一致するかどうかを確認する必要があります。ここで目的の出力に近いものを見つけましたが、vue を使用して再現する方法がわかりません。どんな入力でも大歓迎です。item.namecostList