如何将从状态检索到的数组数据分配给 vue.js 中数组数据对象的 v-model？

Question

我有一个使用 vuex getter 检索到的来自 vuex 状态的申请人列表。从前端，我将他们各自的结果记录为一个数组并提交他们的结果。但我无法将申请者 ID 分配给 v-model。

我尝试过使用数组和数组对象但不起作用。 我尝试循环创建页面上的申请者列表并将其分配给Vue数据中声明的数组数据。

模板代码

<template>
<table style="margin-left:10%;">
          <tr>
            <th>#</th>
            <th>Full Name</th>
            <th>Result</th>
          </tr>
          <tr
            v-for="(applicant, key) in getApplicants"
            :key="applicant.applicant_id"
          >
            <td>{{ key + 1 }}</td>
            <td>
              {{ applicant.first_name }} {{ applicant.middle_name }}
              {{ applicant.last_name }}
              <b-form-input v-model="record.applicant_id[key]"></b-form-input>
            </td>
            <td>
              <b-form-input v-model="record.exam_result[key]"></b-form-input>
            </td>
          </tr>
        </table>
<template>

脚本代码

data() {
    return {
      update: false,
      record: {
        job_vacancy_id: null,
        exam_type_id: null,
        applicant_id: [],
        exam_result: []
      }
    };

methods:{
 save() {
      var object = {
        job_vacancy_id: this.record.job_vacancy_id,
        manpower_requisition_id: this.manpower_requisition_id,
        applicants_id: this.applicants_id,
        exam_result: this.record.exam_result
      };
      console.log(object);
    },
populate() {
      let appliacnts = this.getApplicants;
      for (var i = 0; i <= appliacnts.length; i++) {
        this.record.applicant_id = this.appliacnts.applicant_id[i];
      }
    }
},

created() {
    this.populate();
  }

Answer 1

有几个错误：

1. this.record.applicant_id 是一个数组，所以你需要一个索引，在 = 之前。
2. this.appliacnts 不应有 this。
3. this.appliacnts.applicant_id[i] 有错误部分的索引。它应该在applicant_id 之前。
4. appliacnts 拼写不正确。但它是一致的，因此不会造成任何问题。

纠正我们得到的一切：

populate() {
  const applicants = this.getApplicants;
  for (var i = 0; i <= applicants.length; i++) {
    this.record.applicant_id[i] = applicants[i].applicant_id;
  }
}

虽然这不是一个特别安全的实现。如果再次调用它并且数组更短，它将保留数组中的旧条目。我更倾向于这样写：

populate() {
  const applicants = this.getApplicants;
  this.record.applicant_id = applicants.map(applicant => applicant.applicant_id);
}

Answer 2

我觉得应该是this.record.applicant_id[i] = appliacnts.applicant_id[i]

populate() {
      let appliacnts = this.getApplicants;
      for (var i = 0; i <= appliacnts.length; i++) {
        this.record.applicant_id[i] = appliacnts.applicant_id[i];
      }
    }
},