vue.js - VueJs v-for 如何在继续之前检查未定义的列表

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

v-for将带有指令的 div 放在<template>检查menuvia的 a 中v-if：

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

这样，如果模板内的 divmenu不存在，就不会被渲染。

---

如果你真的想要v-for语句中的检查，就像你正在尝试的那样，它看起来像这样：

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