为什么Vue.js即使存在也不会打印对象属性？

Question

我的模板中有这个

unsafe

在组件中，我肯定定义了<div v-if="errors && errors.name" class="text-danger">{{ errors.name[0] }}</div> 对象，它具有errors属性，并且该属性的值是字符串数组。通过开发工具：

为什么name的第一个数组成员中的字符串没有显示？看来条件errors.name永远都不成立，但我不知道为什么。我尝试使用errors && errors.name代替，但无济于事。

Answer 1

您不能像评论中提到的Michal那样向对象动态添加属性。

data: function () {
  return {
    errors: {
      name: []
    }
  }
}

然后使用数组，您将无法直接分配值，而应使用push方法，并且在使用上述代码初始化它时，您已经具有一个数组：

errors.name.push('Please enter a name.');

最后，在模板中，仅检查长度，因为现在确定存在对象：

<div v-if="errors.name.length > 0" class="text-danger">{{ errors.name[0] }}</div>