有条件地在组件Vue上调用属性？

Question

我有一个元素列表，其中可能包含元素的子集，所以我有一个这样的列表

<v-list>
    <v-list-group v-for="item in items" :key="item.id>
        <v-list-title :to="item.link">
            {{ item.title }}
        </v-list-title>
    </v-list-group>
</v-list>

我的items数组就是这样。

data: function() {
    return {
        items[
            {
                id: 1,
                title: 'foo',
                link: '/dashboard/url/',
                items: []
            },
            {
                id: 2,
                title: 'bar',
                link: '/dashboard/url2/',
                items: [
                    {
                        id: 1,
                        title: 'foo',
                        link: '/dashboard/url/sub'
                    }
                ]
            }
        ]
    }
}

仅当:to有办法动态添加属性时，我才想将属性item.items.length > 0添加到列表中吗？还是有条件地添加它？

Answer 1

您可以在此处使用条件

<v-list-title :to="item.items.length ? item.link : null">
  {{ item.title }}
</v-list-title>