javascript - 当某些对象具有字段而有些对象没有字段时，如何避免出现“TypeError:无法读取未定义的属性'weekday_text'”错误？

我通过向Google Places API发出GET请求来获取景点信息。不幸的是，有些景点有一个opening_hours对象字段，它本身具有weekday_text和open_now字段，但是有些景点却没有，所以我得到了错误

<p v-if='sight.opening_hours && sight.opening_hours.open_now'>Open now</p>
<p v-if='sight.opening_hours && !sight.opening_hours.open_now'>Closed now</p>
<p v-if='sight.opening_hours && sight.opening_hours.weekday_text' v-for='day in this.sight.opening_hours.weekday_text'>{{ day }}</p>

我的v-if是否不涵盖sight.opening_hours和sight.opening_hours.weekday_text不存在的情况？我认为错误来自v-for，因为如果我删除它，一切都会正常。

最佳答案

https://vuejs.org/v2/guide/conditional.html#v-if-with-v-for
不建议同时使用v-if和v-for

<div v-if='sight.opening_hours && sight.opening_hours.weekday_text'>
  <p v-for='day in this.sight.opening_hours.weekday_text'>{{ day }}</p>
</div>

或者，如果您不需要打印div，则可以使用template

<template v-if="sight.opening_hours && sight.opening_hours.weekday_text">
  <p v-for='day in this.sight.opening_hours.weekday_text'>{{ day }}</p>
</template>