Question

我正在通过Vue CLI使用Webpack，并且在尝试使用页面时遇到Error in created hook: "TypeError: _api__WEBPACK_IMPORTED_MODULE_0__.default.$_playerApi_getPlayers is not a function"错误。

这是我的树结构：

.
+ main.js
+ app/
|  + api.js
|  + App.vue
|  + players/
|  |  + api.js
|  |  + index.js
|  |  + routes.js
|  |  + components/
|  |  |  + index.js
|  |  |  + Login.vue
|  |  |
|  |  + vuex/
|  |     + actions.js
|  |     + ...
|  |
|  + others/
|     + api.js
|     + ...
|
+ ...

app / players / vuex / actions.js ：

import { default as api } from '../../api'

export default {

  loadPlayers({ commit }) {
    return api.$_playerApi_getPlayers().then(response => {  // <--- ERROR LINE
      commit('STORE_PLAYERS', response.body)
      return response
    })
    .catch(error => {
      throw error
    })
  },

  loadPlayer({ commit }, playerId) {
    return api.$_playerApi_getPlayer(playerId).then(response => {
      commit('LOAD_PLAYER', response.data)
      return response
    })
    .catch(error => {
      throw error
    })
  },

  ...

}

app / players / api.js ：

export default {

  ...

  $_playerApi_getPlayer(playerId = '') {
    ...
  },

  $_playerApi_getPlayers() {
    ...
  },

  ...

}

app / api.js ：

import { api as players } from './players'

export default {
  players,
}

我很确定这是错误的（已解决），但不确定如何使其正常工作。

我在这里做错了什么？导出和导入似乎还可以，但是它们以某种我无法看到或调试的方式中断了。

我尝试在我的 app / api.js 中使用以下命令，但这是错误的，因为导出不是数组：

import { api as players } from './players'

export default {
  ...players,
}

我还尝试在我的 app / players / api.js 中使用以下内容，但它也不起作用：

export default {

  methods: {

    ...

    $_playerApi_getPlayer(playerId = '') {
      ...
    },

    $_playerApi_getPlayers() {
      ...
    },

    ...

  },

}

Answer 1

在您的app/api.js中：

import * as players from './players/api'
export default {
  ...players,
}

并在您的app/players/api.js中：

export function $_playerApi_getPlayer(playerId = '') {
   ...
}

export function $_playerApi_getPlayers() {
   ...
}

导入的函数未定义

1 个答案: