Question

我有一个从API获取的数据列表。我想检查列表中的每个元素是否都有子元素/子元素，然后根据决策添加一个类。

我的尝试：

<template>
    ...
    <ul>
        <li v-for="nav in navigation" :class="{conditionalClass: isNavDropdown(nav)}">xxxx</li>
    </ul>
    ...
</template>

然后在methods我有这个功能：

<script>
    ...
    methods: {
        isNavDropdown: function (nav) {
            return nav.children[0] !== null
        }
    }
    ...
</script>

这不起作用。在控制台中打印nav会给我一个奇怪的对象，其中包含reactiveGetter()和reactiveSetter()等元素（其中的多个）。

甚至可以用vuejs来实现这样的事情吗？或者我是否需要使用javascript技巧来实现这一目标？

Answer 1

您可以在HTML中检查，而无需单独的方法。

...
<li v-for="nav in navigation" :class="{conditionalClass: nav.children}">xxxx</li>
...

Vuejs列表循环 - 根据每个子项的属性添加类

1 个答案: