javascript - 当我 console.log() 来自数组的特定元素时，我可以看到所有属性。当我 console.log() 整个数组时，缺少该 objects 属性

Question

不知道发生了什么。我正在通过 axios 发出 GET 请求，如下所示：

    async getUserServers({commit, state, dispatch}, userId){
        try {
            let response = await axios.get("/servers/" + userId)
            console.log(response.data.servers)
            console.log(response.data.servers[0].rooms[0].messages[0].user)
        } catch (error) {
            console.log(error)
        }
    },

正如你所看到的，我正在console.log()两个：

console.log(response.data.servers)
console.log(response.data.servers[0].rooms[0].messages[0].user)

第二个 console.log() 返回：

{
  "id": 1,
  "username": "Test",
  "email": "[e-mail]",
  "image": "test.png",
  "createdAt": "2020-08-12T21:09:58.000Z",
  "updatedAt": "2020-08-12T21:09:58.000Z"
}

但是当我通过控制台console.log(response.data.servers)导航到时response.data.servers[0].rooms[0].messages[0].user，我看不到messages[0]被调用的属性user。

此外，当我尝试渲染里面的内容时，response.data.servers[0].rooms[0].messages[0].user我得到了空的 div 并且没有错误。

有趣的是，每当我刷新页面时，我都可以看到预期的内容response.data.servers[0].rooms[0].messages[0].user在消失前呈现一毫秒。如果我不断刷新垃圾邮件，我可以清楚地阅读所有内容。

完整代码：

    async getUserServers({commit, state, dispatch}, userId){
        try {
            let response = await axios.get("/servers/" + userId)
            let servers = response.data.servers

            commit('setServers', servers) <-- The messages[0].user property disappears because of this
        } catch (error) {
            console.log(error)
        }
    },

Vuex突变：

    setServers(state, servers){
        state.servers = servers
    },

标签： javascript