带有 axios 的 Vue 需要 5 到 7 秒才能使用小数据进行 api 调用

问：

日安

我的 VUE 应用程序存在很大问题，即我的 API 调用非常非常慢。

我有一个 Laravel 后端，可以及时提供数据，并通过域 https://api.example.com 做出相应的响应。

但是，在我的仪表板中，我进行了三个 API 调用，加载内容需要 5 到 8 秒：

结果，用户大量抱怨加载时间。 在代码中，我目前按如下方式调用调用：

  async mounted() {
    this.personalDeletegatesId = userInfo.user.delegatesid
    this.getTasks()
    this.getAddresses()
    this.getRequestTypes()
  },

每个函数都是作为异步方法创建的。 无论是在生产中还是在本地，应用速度都很快。

    getAddresses: async function () {
      this.$http.get('/addresses/delegates/' + userInfo.user.delegatesid)
          .then(function (response) {
            this.items = uniqueElementsBy(response.data[0], (a, b) => a.id == b.id)
            this.itemsnotasks = uniqueElementsBy(response.data[1], (a, b) => a.id == b.id)
            this.itemsfav = uniqueElementsBy(response.data[2], (a, b) => a.id == b.id)
            this.getCounts()

            }.bind(this))
    },
    getTasks: async function () {
      this.$http.get('/salestasks/delegates/' + userInfo.user.delegatesid)
          .then(function (response) {
            this.itemsTasks = uniqueElementsBy(response.data, (a, b) => a.salestasks_id == b.salestasks_id)
          }.bind(this))
    },