如何在 Vue 中使用 Axios 获取特定的 属性 名称？

Question

我这里有一个来自 Laravel 中的 API 的对象，我只想在 getDesignations() 方法中获取 name 的值。但是它说它是 returns 字符串，并希望数组使其工作。

[
  {
    "id": 2,
    "name": "Maintenance and Repair Worker2",
    "description": "Et eius perferendis est at.3232",
    "created_at": "2022-03-21T07:44:53.000000Z",
    "updated_at": "2022-03-21T07:47:57.000000Z"
  },
  {
    "id": 3,
    "name": "Janitorial Supervisor",
    "description": "Quaerat qui culpa placeat et.",
    "created_at": "2022-03-21T07:44:53.000000Z",
    "updated_at": "2022-03-21T07:44:53.000000Z"
  }
]

这是我的方法：

<script>
    export default {
        data() {
            return {
                employee: {},
                value: [],
                options: [],
            }
        },
        methods: {
            addEmployee() {
                this.axios
                    .post('/api/employees', this.employee)
                    .then(response => (
                        this.$router.push({ name: 'employees' })
                    ))
                    .catch(err => console.log(err))
                    .finally(() => this.loading = false)
            },
            getDesignationNames() {
                this.axios.get('/api/designations').then((res) => {
                    const designations = res.data;
                    for (const [key, value] of Object.entries(designations)) {
                        this.options = value.name;
                    }
                }).catch(err => console.log(err))
            }
        },
        created: function() {
            this.getDesignationNames();
        },
    }
</script>

Answer 1

您的选项数据是数组。可以推送一个数据了。

this.options.push(value.name);