Vue：将 response.data 放入本地数组后丢失对象属性答案

【问题标题】：Vue: lost object attribute after put response.data to local arayVue：将 response.data 放入本地数组后丢失对象属性
【发布时间】：2021-12-07 21:49:16
【问题描述】：

我有返回 json 对象的 API，如下所示：

[
{"id":3,"delivery_from":"bsl","task_id":410169,"unit_job_id":224128,"completed_at":null,"deleted_at":null,"created_at":"2021-10-20T13:24:07.000000Z"},
{"id":3,"delivery_from":"bsl","task_id":410169,"unit_job_id":224128,"completed_at":null,"deleted_at":null,"created_at":"2021-10-20T13:24:07.000000Z"}
]

当我在浏览器控制台中打印 response.data 时，我看到所有对象参数都正常，但是当我将 response.data 放入本地数组 deliveryJobs: [] 时，我看到 task_id 属性未定义。我做错了什么？

<script>
  import AxiosHandler from './mixins/AxiosHandler'
  import axios from 'axios'

  export default {
    i18n: window.i18n,
    mixins: [
      AxiosHandler,
    ],
    props: {
      unitJobId: Number,
      unitId: Number,
      taskId: Number
    },
    data: () => ({
      deliveryJobs: [],
      unitJob: {}
    }),
    async created () {
      this.getDeliveryJobs()
    },
    methods: {
      getDeliveryJobs () {
        axios
        .get(`/api/v1/unitjobdelivery`, { params : { unit_job_id : this.unitJobId } })
        .then(response => {
          this.deliveryJobs = response.data
        })
        .catch(this.handleAxiosError)
      }
    }
  }
</script>

【问题讨论】：

所以deliveryJobs 在这个组件中是本地的，但taskId 作为道具接收。你确定你不会在任何地方变异吗？由于vue.js 属性是反应性的，因此必须有一些操作导致您的对象中的task_id 变得未定义。
嗨 Stiven，也许我不明白你的意思，但不要认为这是由于道具 taskId。我删除了道具，结果是一样的 - task_id 存在于 response.data 中，但是当我将 response.data 提供给 deliveryJobs [] 时它消失了
我的意思是，你必须在某个时刻改变task_id，因为它不可能在不采取任何行动的情况下从数字变为未定义。
我不明白你的意思，我不知道是什么让对象属性未定义

标签： javascript arrays vue.js vuejs2 vue-component

【解决方案1】：

找到解决方案。我的 API 返回 laravel 集合而不是数组。我将返回更改为数组，现在一切正常。

【讨论】：