Laravel 关系在到达 Vue 中的相应属性时会导致错误

Question

在 Laravel 控制器中，我有类似的东西：

$entry = Entry::with('studio','user','user.operator','type', 'chef')
    ->find($entryId);

// return entry with database fields and relationships

现在在 Vue 中（通过 Vuex 和 Axios 工作）：

1. 如果我尝试获取 Entry 元素的属性，那效果很好：

   {{!entry.occurred_at ? '-' : entry.occurred_at}}
   
   // output
   // 2017-09-03 16:45:46
   

2. 如果我尝试从 Entry 类关系中取出一些东西（我通过 with() 方法收到了它），也可以深入一层：

   {{!entry.user ? '-' : entry.user}}
   
   //output
   // { "id": 50, "username": "mihails.vankins", "change_password": 0, "logged_in_at": "2019-09-18 14:57:36", "deleted_at": false, "created_at": "2018-06-04 16:59:41", "updated_at": "2019-09-18 21:01:04" }
   

3.但是，如果我尝试深入到这样的关系中的一层以上：

 {{!entry.user.username ? '-' : entry.user.username }}

我收到正确的输出，但在我的控制台中我收到如下错误：

[Vue warn]: Error in render: "TypeError: _vm.entry.user is undefined"
TypeError: "_vm.entry.user is undefined"

我做错了什么？

Answer 1

你应该像这样检查：

 {{(entry.user && entry.user.username) ?entry.user.username :'-'  }}

如果有更多的对象级别例如：

{{ (entry.user && entry.user.fullname && entry.user.fullname.first && ...)   }}