javascript - 如何在 VueJS 插值中为 undefined object 属性使用默认值？

如何在 VueJS 插值中为 undefined object 属性使用默认值？我的 data 是一个计算变量，在选择框中选择 selectedDataId 之前首先未定义，因此 vue 发送 “无法读取未定义的属性 'grandChild'” 错误。

PS:我正在使用 lodash

<div>
    {{ selectedData.child.grandChild }}
</div>

new Vue({
   data: {
       selectedDataId: null,
       selectedData: {},
       data: [ //array of objects here ]
   },
   computed: {
       selectedData() {
           return _.find(this.data, (d) => {
               return d.id == this.selectedDataId;
           });
       }
   }
});

最佳答案

您可以使用以下模式:

{{ selectedData.child && selectedData.child.grandChild || 'default value' }}

它将安全地检查 grandChild 并打印“默认值”，如果它是假的。

关于javascript - 如何在 VueJS 插值中为 undefined object 属性使用默认值？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40688718/