VueJs v-如何在继续之前检查列表undefined

Question

请参阅下面的模板,如何添加条件,以确保menu不是undefined里面v-for的属性？

我试过了v-for="menu?item in menu.items:[]",v-for="item in menu?.items"但都没有用.

<div v-for="item in menu.items">{{item.text}}</div>

Answer 1

把div与v-for指令放在一个<template>检查menu通过v-if:

<template v-if="menu">
  <div v-for="item in menu.items">{{ item.text }}</div>
</template>

这样,如果menu不存在,则不会呈现模板内的div .

如果您真的想在v-for声明中进行检查,就像您正在尝试一样,它将如下所示:

<div v-for="item in (menu ? menu.items : [])">{{ item.text }}</div>