VueJs v-für die Überprüfung der Liste undefined vor dem Fortfahren

Question

Siehe die Vorlage unten, wie Sie Bedingung hinzufügen, um sicherzustellen, dass die menu nicht undefined innerhalb der v-for Attribut ist?

Ich habe versucht v-for="menu?item in menu.items:[]" und v-for="item in menu?.items", aber keiner funktioniert.

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

Answer 1

Setzen Sie die div mit der v-for Richtlinie innerhalb eines <template>, die für menu über v-if prüft:

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

Auf diese Weise wird die div in der Vorlage nicht gerendert werden, wenn menu existiert nicht.

---

Wenn Sie wirklich die Prüfung innerhalb des v-for Anweisung wollen, wie Sie versuchen, würde es so aussehen:

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