在vue.js中保存输入的初始值

Question

我有一个可以渲染到子组件中的道具，并且已经在input中显示了道具的价值。初始值为 学生证

<form @submit.prevent="insertScore"> 
  <td v-for> 
     <input type="text" :value="classlist.id" />
  </td>
     <button type="submit">save</button>
</form>

在我的数据函数中

  props: ["classlists"],
  data() {
    return {
      form: new Form({
        studentId: [] 
      })
    };
  },
//insertScore

如何将我的初始值保存到form.studentId中，并且还需要将此值传递到laravel中的商店控制器中

这是我的班级道具

[
 {"student": "Ebony Hand",           "gender": "female",   "id": 1 },
 {"student": "Maryse Orn",           "gender": "male",     "id": 2 }, 
 {"student": "Dr. Maverick Steuber", "gender": "male",     "id": 3 }, 
 {"student": "Korbin Rutherford",    "gender": "male",     "id": 4 }
]

Answer 1

输入created（或mounted）生命周期方法并在那里进行设置。
像这样：

created(){
   this.form.studentId = this.studentId (assuming thats what the prop is called)

Answer 2

您可以使用v-model指令在表单输入，文本区域和选择元素上创建双向数据绑定。

  <input v-model="message" placeholder="edit me">

要将v-model与form.studentId [n]一起使用：

1. 表单应该是数据属性。
2. form.studentId应该是一个数组。

然后您可以执行以下操作：

 <div v-for='classlist in classlists'>
  <input v-model="form.studentId[classlist.id]">
 </div>



   data() {
     form: {
       studentId: []
     }
  }