axios__WEBPACK_IMPORTED_MODULE_0 ___ default.a [метод] не является функцией

Question

Я получаю ошибку выше, когда делаю запрос к бэкэнду.У меня есть подобный код на другом проекте, нет проблем.но здесь это вызывает проблемы

мой код:

import axios from 'axios';
export default function apiCall(method, path, data) {
    console.log(method, url, data); 
    return new Promise((resolve, reject) => {
        return axios[method](path, data)
                .then(res => {
                    return resolve(res.data);
                })
                .catch((err) => {
                    console.log(err)
                    reject(err)
                });
    });
}

функция вызова API

apiCall('POST', `${process.env.REACT_APP_BASE_URL}/`, {standard, subject, totalMarks, totalQuestions} )
        .then(data =>{
            console.log(data);

        })
        .catch(err=>{
            console.log(err);
            return this.props.addError(err.message)

        });

Answer 1

Обратите внимание на тот факт, что объекты в javascript чувствительны к регистру, поэтому при доступе к obj['post'] и obj['POST'] будут возвращаться разные значения.

axios имеет метод get, post и т. Д., Как в нижнем регистре , вы пытаетесь получить к ним доступ через в верхнем регистре , поэтому вы получаете неопределенное значение.

Это можно исправить, преобразовав переменную метода в строчные буквы .

import axios from 'axios';

export default function apiCall(method, path, data) {
    return new Promise((resolve, reject) => {
        return axios[method.toLowerCase()](path, data)
                .then(res => {
                    return resolve(res.data);
                })
                .catch((err) => {
                    console.log(err)
                    reject(err)
                });
    });
}

Кстати, методы axios уже возвращают Promises, так что вы можете сделать свой код немного проще, используя его.

import axios from 'axios';

export default function apiCall(method, path, data) {
    return axios[method.toLowerCase()](path, data)
           .then(res => res.data)
           .catch((err) => {
                console.log(err);
                return Promise.reject(err);
           });
}