无法在 Javascript 中使用 Axios get 获取数组的所有元素（通过 JavaScript 中的数组循环）

【问题标题】：无法在 Javascript 中使用 Axios get 获取数组的所有元素（通过 JavaScript 中的数组循环）(cannot get all elements of array using Axios get in Javascript (Loop through an array in JavaScript))
【发布时间】：2022-02-11 15:41:28
【问题描述】：

/* 我的任务是从这个 localhost 页面上的 API 获取用户的日常工作活动信息。如果用户涉及多个项目，则需要获取多行信息而不是仅获取一条信息。我目前的代码是只能从API获取第一个项目信息的代码。在这种情况下，只能显示一行信息，如下图所示。我想显示多行信息。可能是因为列表“ time_cards ”看起来像“ time_cards [0] ”，所以我只能得到第一个元素。我猜，“循环遍历 JavaScript 中的数组”我认为这种方法有效，但我不知道如何修复代码。请帮帮我。*/

front end local host page image here com/YxSjG.png

您需要对数组的数据进行循环，但您需要将数据作为 time_cards 数组返回。

【解决方案1】：

啊，你正在返回一个对象。但不是对象数组。所以你必须通过

Object_values()

在 api 调用中。所以是这样的：

async fetchWorkerTimeCard() {
  if (this.calendarVal == null) {
    // get today
  } else {
    try {
      await this.$axios.$get('/worker_time_card', { params: { work_date: this.calendarVal } }).then(Object_values(data) => {
        this.worker_time_card.push( {
          start_time: data.start_time,
          end_time: data.end_time,
          rest_time: data.rest_time,
          worked_time: data.worked_time,
          duration: data.time_cards[0].duration,  
          work_log: data.time_cards[0].work_log, 
          project_id: data.time_cards[0].project_id,  

        })
      })
    } catch (error) {
      console.log(error)
      this.worker_time_card = []
    }
  }
},

我编辑了这个并发布了整个代码。我正在为这个项目使用 UI 框架 Vuetify。我猜我是否应该在“data()”函数内的“worker_time_card: []”嵌套列表中创建两个对象。

分享于2022年07月17日 async-await axios for-loop vue.js 问答