cannot read property 'then' when calling axios in helper function

Question

I separated out an axios call into another file called ApiMethods.js.

Now, whenever I try to use the 'uploadSpecFile' function inside ApiMethods.js, I get this error:

Uncaught TypeError: Cannot read property 'then' of undefined

Here is that helper method:

export function uploadSpecFile(formData, engineId) {
    return
    axios({
        method: 'post',
        url: `/api/engineData/spec-files/${engineId}/files/upload`,
        data: formData,
        config: {
            headers: { 'Content-Type': 'multipart/form-data' }
        }
    })
}

And I use it here:

import {  uploadSpecFile } from '/ApiMethods';

// error occurs here  **
uploadSpecFile(bodyFormData, this.props.engineId).then(response => {

        this.setState({
            selectedFile: response.data,
            file: null
        });
    })
    .catch(response => {
    });

Is there something I'm doing wrong?

Thanks!

score 2 · Accepted Answer · answered Aug 01 '18 at 18:43

You are returning undefined, since axios is not on the same line as the return statement.

Just move the axios request to the same line and it will work as expected.

export function uploadSpecFile(formData, engineId) {
  return axios({
    method: "post",
    url: `/api/engineData/spec-files/${engineId}/files/upload`,
    data: formData,
    config: {
      headers: { "Content-Type": "multipart/form-data" }
    }
  });
}

cannot read property 'then' when calling axios in helper function

1 Answers1