如何将函数导入 Vue 组件？

Question

I have a js file named axios.js. Inside this file:

import axios from 'axios';

export function axiosGet (url, data, loading) { 
        axios.get(url, data, loading)
                .then((response) => {
                    loading = false;
                    data = response.data;
                })
                .catch(error => console.log(error))
                .finally(() => {
                    loading = true;
                })
}

I have a Vue component where I import this function:

import {axiosGet} from '../axios.js'

mounted() {
        axiosGet('https://jsonplaceholder.typicode.com/users', this.APIusers, this.isLoading);
}

where APIusers and isLoading are in data.

I get no error but it's not working.

What should I change to make it work?

Answer 1

Your problem is not related to importing function in vue component.

You have to change calling api function to this:

  async mounted() {
    this.isLoading = true;
    const res = await axiosGet("https://jsonplaceholder.typicode.com/users");
    if (res) {
      this.APIusers = res;
    }
    this.isLoading = false;
  }

and api function:

export async function axiosGet(url) {
  try {
    const response = await axios.get(url);
    return response.data;
  } catch (err) {
    console.log(err);
  }
}

here is working deme: https://codesandbox.io/s/hopeful-murdock-xqpws