Question

这个问题有几个版本，但是我发现了一个我无法理解的特定场景。我在父元素上有这个模板：

<tbody>
    <tr is="tree-item" v-for="item in children" :item="item"></tr>
</tbody>

到目前为止一切顺利。子元素是：

<tr v-on:click="toggle" class="{{ classes }}">
    <td class="name">
        {{ item.tree_item_heading }}
    </td>
</tr>

<tr v-show="isLoaded" is="tree-item" v-for="item in grandChildren" :item="item"></tr>

它是一个递归表单行，因此如果第一个tree-item有子项，它们也会呈现为tree-item。虽然它显示正常，但它呈现为片段实例，因此忽略v-show属性。

关于如何解决这个问题的任何想法？

干杯

Answer 1

您可以尝试为父循环使用多个tbody标记：

<tbody v-for='item in children'>
    <tr is="tree-item" :item="item"></tr>
    <tr v-show="isLoaded" is="tree-item" v-for="gItem in item.children" :item="gItem"></tr>
</tbody>

Vue中的嵌套表行

1 个答案: