数组在VueJS对象中未定义

Question

在使用VueJS方面我是一个非常新的人，因此我正在开发一个小型应用程序，该应用程序应列出经过身份验证的人的Github存储库。 我在访问甚至遍历下图中的数组时遇到麻烦。如果尝试使用userRepos，我会不断收到undefined的错误消息。请在下面查看我的代码。

我对“代码墙”深表歉意。但我认为这些javascript代码段与该问题最相关。

这是我正在用作该项目的样板的GitHub存储库。 GitHub-Electron-Vue-OAuth

const getAxiosClient = (state) => {
  return axios.create({
    baseURL: state.server.url, // this is "https://api.github.com
    headers: {
      'Authorization': 'token ' + state.session.access_token
    },
    responseType: 'json'
  })
}
// Mutation
[types.SET_USER_REPOS](state, repos) {
  state.session.repos = repos;
},
// State Object
const state = {
  server: {
    url: 'http://api.github.com'
  },
  session: {
    access_token: window.localStorage.getItem('access_token'),
    ready: false,
    authenticated: false,
    user: {}
  }
};
// Actions
export const getRepos = ({
  commit,
  state
}) => {
  return new Promise((resolve, reject) => {
    getAxiosClient(state).get('/user/repos').then(response => {
      commit(types.SET_USER_REPOS, response.data)
      resolve(response.data)
    }, err => {
      console.log(err)
      reject(err)
    })
  })
}

export const userRepos = (state) => {
  console.log(state.session.repos)
  return state.session.repos;
}

<template lang="jade">
  .home
    span Hello {{ username }}
    span {{ userRepos }}
    
</template>

<script>
  export default {
    name: 'home',
    computed: {
      username() {
        return this.$store.getters.username;
      },
      userRepos() {
        return this.$store.getters.userRepos;
      }
    },
    // TODO: Push this in router
    beforeRouteEnter(to, from, next) {
      next(vm => {
        if (!vm.$store.getters.isAuthenticated) {
          vm.$router.push({
            name: 'login'
          });
        } else {
          next();
        }
      });
    }
  }
</script>