【Vue】vue表单里的输入框是循环出来的，如何绑定v-model的值？

我现在有个表单提交，输入框是循环出来的：
保存提交的时候获取v-model="formRecord.assayItemValue"里的值是相同的，该怎么办？并且我要拿到每个有值的表单对应的信息

<Col span="12" v-for="item in unitList">
<Col span="18">
<FormItem :label="item.enName">
<Input placeholder="请输入" v-model="formRecord.assayItemValue"></Input>
</FormItem>
</Col>
<Col span="6">{{item.unit}}</Col>
</Col>

【Vue】vue表单里的输入框是循环出来的，如何绑定v-model的值？

回答

<Col span="12" v-for="item in unitList">
<Col span="18">

<FormItem :label="item.enName">
  <Input placeholder="请输入" v-model="**item.dataValue**"></Input>
</FormItem>

</Col>
<Col span="6" style="padding: 0;">{{item.unit}}</Col>
</Col>

我之前遇到过，我把input的值存在每个Item中，然后再去取~

直接v-model="item.value"这样就行，然后再unitList 用for循环取出每个value

v-model="formRecord.assayItemValue"这样写都绑在同一个上了 做个区分，都绑定在同一个当然相同的数据了。

你绑定的是同一个变量肯定是一样的值啊，，每个input绑定不同的变量

data(){

return {
    formRecord_assayItemValue:{}
}

}
v-model = "formRecord_assayItemValue[index]"

如果unitList是从后台获取的，那么弄个计算属性如下，
v-for的时候换成这个，v-model="formRecord.value"

computed:{
 unitListWithValue(){
  var temp = []
  this.unitList.forEach(v=>{
   v.value = ''
   temp.push(v)
  })
  return temp
 }
}

如果是你定义在 data 里面写死的，那就每个元素加个value的属性，循环的时候各自绑定就好啦

以上是 【Vue】vue表单里的输入框是循环出来的，如何绑定v-model的值？ 的全部内容， 来源链接： utcz.com/a/77129.html

回到顶部