javascript - Vue.js "Cannot read property ... of undefined"- 解决这个预期的行为

标签 javascript mongodb vue.js vuejs2 undefined

是否知道,如果您在 Vue.js 模板中显示对象的属性,并且该对象未定义 - 这将使组件崩溃。如果常规变量未定义,则没有问题。

这种行为令人扫兴。在我的情况下,这似乎很普遍,避免这个问题的最佳方法是什么?

因此,我将数据存储在 NoSQL 数据库(即 Mongo)中,并使用 Vue.js 组件来查看和修改集合中的文档。效果很好。

但是,如果我将一个具有属性的对象添加到我的架构中(例如带有 zip、状态的地址...),并更新组件来显示它们,那么现在我的 web 应用程序中显示这些文档的所有组件都会崩溃,因为对象不在数据中。只有新文档(带有新对象)才会正确显示,除非我通过数据库并将此“地址”对象添加到每个现有文档中。

如果模板能让用户有机会查看空白数据或添加数据库中尚未存在的数据,那就太好了。

这种情况下的最佳做法是什么?

这里应该简单地避免物体吗?

最佳答案

这与 Vue 没有任何关系。您在这里处理的是 javascript 错误。您不能引用 null/ undefined variable 的属性。解决这个问题的简单方法是使用 && 运算符来检查对象。

someObj && someObj.property

如果 someObj 为假,则永远不会评估右侧。请注意,当左侧为真时,&& 返回右侧。详情:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators

如果你想要一个特定的空白值,你可以这样做

someObj ? someObj.property : "Default value"

关于javascript - Vue.js "Cannot read property ... of undefined"- 解决这个预期的行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46535544/

相关文章:

php - PHP 中的 MongoRegex 返回错误结果?

mongodb - Play 2.2.x,带有身份验证和请求扩展的 Action 组合

vue.js - 是否可以观看注入(inject)的属性(property)

javascript - VueJS - v-if 和 v-show 无法正常工作

javascript - 如何在 JavaScript 中使用 array reduce with condition?

javascript - 单击更改按钮几秒钟

javascript - 使用 RequireJS Backbone 集合设置默认 API url

javascript - 在鼠标悬停上使用 d3.js 时,工具提示未显示在元素顶部

javascript - 当秒来临时,做点什么

python - 在python中通过身份验证连接到套接字