时间戳

首页 > 解决方案 > 如何在 Vue.js 中处理空数组数据

vue.js - 如何在 Vue.js 中处理空数组数据

问题描述

Vue.js 中的一个简单问题。在这段代码中，第二个“项目”没有任何“属性”，显然没有“数字”，这使得html显示为空白，当数组中没有数据时如何处理？我试过 v-if 但不能让它工作。谢谢

<div v-for="propiedad in info" class="propiedad">
   <div class="propiedad">
       {{ project.Property[0].Number }}
   </div>
</div>

标签： vue.js

解决方案

我将“这使 HTML 显示为空白”的问题视为“控制台中有一些错误，整个页面都失败了”。

你可以这样做 project && project.Property[0] && project.Property[0].Number

或者，如果您正在使用带有插件babel-preset-env 的 babel，您可以利用可选的链接功能

project?.Property[0]?.Number

推荐阅读