Импортированные функции не определены

Я использую Webpack через Vue CLI и получаю сообщение об ошибке 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
|     + ...
|
+ ...

приложение / игроки / 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
    })
  },

  ...

}

приложение / игроки / api.js:

export default {

  ...

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

  $_playerApi_getPlayers() {
    ...
  },

  ...

}

приложение / api.js:

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

export default {
  players,
}

Я почти уверен, что это неправильно (обв.), Но не уверен, как заставить его работать должным образом.

Что я здесь делаю не так? Экспорт и импорт кажутся нормальными, но они почему-то ломаются, что я просто не могу увидеть или отладить.

Я пробовал использовать следующее в моем приложение / api.js, но это неправильно, потому что экспорт не является массивом:

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

export default {
  ...players,
}

Я также пробовал использовать в моем приложение / игроки / api.js следующее, но это тоже не сработало:

export default {

  methods: {

    ...

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

    $_playerApi_getPlayers() {
      ...
    },

    ...

  },

}

Можете ли вы опубликовать созданный код ловушки, откуда возникает ошибка?

wrufesh 28.12.2018 08:17
* as players это пробовали?
Jai 28.12.2018 08:17

в вашем app/app.js, почему не import api as players from './players'? без {}

quirimmo 28.12.2018 08:23

@wrufesh местоположение, которое он дает в качестве местоположения ошибки, - это указанная строка в приложение / игроки / vuex / actions.js

Benjam 29.12.2018 10:30

@wrufesh Созданный хук просто вызывает this.loadPlayers()..., который был отображен через ...mapActions

Benjam 29.12.2018 10:36

Разместите, пожалуйста, свои игроки / index.js

wrufesh 30.12.2018 14:02
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
6
160
1

Ответы 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() {
   ...
}

Это не сработало. Я по-прежнему получаю ту же ошибку, что и выше.

Benjam 29.12.2018 10:34

Это сработало, если я изменил приложение / api.js на экспорт с ...players.

Benjam 29.12.2018 10:43

Вы можете объяснить, почему это необходимо в некоторых случаях?

Douglas Gaskell 18.09.2019 00:18

Другие вопросы по теме