如何将函数导入Vue组件?

时间:2020-08-23 12:45:41

标签: javascript vue.js

我有一个名为axios.js的js文件。在此文件内:

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;
                })
}

我有一个Vue组件,可以在其中导入此功能:

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

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

APIusers和isLoading在数据中的位置。

我没有收到任何错误,但是没有用。

我应该进行哪些更改才能使其正常工作?

1 个答案:

答案 0 :(得分:0)

您的问题与vue组件中的导入功能无关。

您必须将调用api函数更改为此:

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

和api函数:

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

这是工作环境:https://codesandbox.io/s/hopeful-murdock-xqpws