Question

我有一个嵌套的v-for，基本上，我想获取父v-for的索引并在子v-for中使用它

<template v-for="(branch, index) in $store.state.agency.branch_users.users">
    <table  class="table" id="agency-contact-table" >
        <thead>
            <tr>
                <th aria-colindex="1" class="">#</th>
                <th aria-colindex="1" class="">Name</th>
            </tr>
        </thead>
        <tbody>
            <tr v-if="branch.role_users" v-for="(branch_users, index) in branch.role_users">
                <td>{{$parent.$index}}</td>
                <td>{{branch_users.user.first_name}} {{branch_users.user.last_name}}</td>
            </tr>
        </tbody>
    </table>
</template>

我尝试使用$parent.$index，但仍然无法正常工作。它没有显示任何错误，但也没有数据。我该怎么做才能在父母v-for中获得index？

Answer 1

只需用另一个名称定义另一个索引，或将第一个命名为parent_index

<template v-for="(branch, parent_index) in $store.state.agency.branch_users.users">
    <table  class="table" id="agency-contact-table" >
        <thead>
            <tr>
                <th aria-colindex="1" class="">#</th>
                <th aria-colindex="1" class="">Name</th>
            </tr>
        </thead>
        <tbody>
            <tr v-if="branch.role_users" v-for="(branch_users, index) in branch.role_users">
                <td>{{parent_index}}</td>
                <td>{{branch_users.user.first_name}} {{branch_users.user.last_name}}</td>
            </tr>
        </tbody>
    </table>
</template>

Vue嵌套v-for，获取父级索引

1 个答案: