Проблема с импортом экземпляра в ReactJS. Может кто-нибудь объяснить мне, почему это работает? - PullRequest
0 голосов
/ 23 апреля 2020

У меня есть этот модуль ( src / api / ax ios. js), который экспортирует экземпляр Axios с пользовательскими baseURL и header. Я установил в заголовке токен, который получаю с помощью authenticate.getToken():

import Axios from "axios";
import authenticate from "../classes/Authenticate";

const axios = Axios.create({
    baseURL: "http://localhost:3333/api",
    headers: { "x-auth-token": authenticate.getToken() },
});

axios.defaults.headers.post["Content-Type"] = "application/json";

axios.interceptors.request.use(request => {
  console.log(request);
  return request;
}, error => {
  console.log(error);
  return Promise.reject(error);
});

axios.interceptors.response.use(response => {
  console.log(response);
  return response;
}, error => {
  console.log(error);
  return Promise.reject(error);
});

export default axios;

Я импортирую axios.js в другой модуль ( src / api / client. js), где я обрабатывать запросы:

import axios from "../api/axios";

export default {
  // User
  login(email, password) {
    return axios.post("/authenticate/", { email, password });
  },

  // Schedule
  getSchedule() {
    return axios.get("/schedule/");
  }
}

ПРОБЛЕМА

Если я импортирую axios.js ТОЛЬКО в client.js, я получаю эту ошибку:

TypeError: Невозможно прочитать свойство 'getToken' из неопределенного

Похоже, что экземпляр Authenticated не определен.

ИСПРАВЛЕНИЕ ЧТО Я НЕ ПОНИМАЮ

Однако, если я импортирую axios.js в App.js И в client.js, это работает. Почему? Импорт axios.js у меня в App.js не используется.

Вы можете ознакомиться с репо здесь:

https://github.com/sickdyd/booking-manager/tree/master/frontend

...