获取请求会产生其中包含数据的响应，但是专门访问.data时会产生未定义的响应

Question

很抱歉，如果术语不是很好，对于新手来说还是新手。

你好！我试图让我的数据库中的所有用户。当客户端收到响应get()时，OK的响应为(see image below)

问题在于，当我尝试获取.data时会得到undefined。

这是我的Vue Component

import UserService from '@/services/UsersService.js'

export default {
  data () {
    return {
      users: null
    }
  },
  async mounted () {
    // GET request for all users.
    this.users = UserService.index().data
    console.log('The response is OK', await UserService.index())
    console.log('when trying to fetch the .data I am getting  ', await this.users)
  }
}

index（）函数

import Api from '@/services/Api'

export default {
  index () {
    return Api().get('users')
  }
}

一切正常，除了我得到undefined数据...

Answer 1

我认为您忘了异步获取数据吗？

  async mounted () {
    // GET request for all users.

-   this.users = UserService.index().data
+   const res = await UserService.index()
+   this.users = res.data

    console.log('The response is OK', await UserService.index())
    console.log('when trying to fetch the .data I am getting  ', await this.users)
}

您在第一个await中正确使用了console.log语法，这也许可以解释为什么数据正确返回。