vue.js - 怎么再v-for循环中进行v-model数据绑定
本文介绍了vue.js - 怎么再v-for循环中进行v-model数据绑定的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<div class="form-group">
<label class="col-sm-2 control-label">字段解析:</label>
<div class="col-sm-6">
<select class="col-sm-6 form-control " v-show="submit.UrlListDetail" v-model="fieldParseList">
<option v-for="(type,key) in fieldParseListDiv ">{{key}}</option>
</select>
<div class="infAdd" @click="Add">ADD</div>
<div v-for="item in submit.fieldParseList" class="AddDiv col-sm-9">
<div v-for="(key,val,index) in item" class="form-group">
<label class="col-sm-3 control-label">{{val}}:</label>
<input type="text" class="col-sm-8 form-control" v-model="submit.fieldParseList[index][key]"></input>
</div>
</div>
</div>
</div>
export default {
data () {
return {
submit: {
fieldParseList: []
},
fieldParseListDiv: {
XPATH: {
filedName: '',
type: 'XPATH',
parse: ''
},
REGEX: {
filedName: '',
type: 'REGEX',
parse: ''
},
CSS: {
filedName: '',
type: 'REGEX',
parse: '',
extra: ''
}
}
}
},
methods: {
Add: function () {
let value = this.fieldParseList
console.log(value)
let div = this.fieldParseListDiv[value]
this.submit.fieldParseList.push(div)
}
}
}
我想点击ADD添加div后,让div的input里的数据用v-model绑定,但是不知道该怎么写,求大神来知道
解决方案
找到解决方法了
<div v-for="(item,index) in submit.fieldParseList" class="AddDiv col-sm-9">
<div v-for="(val,key) in item" class="form-group">
<label class="col-sm-3 control-label">{{key}}:</label>
<input type="text" class="col-sm-8 form-control" v-model="submit.fieldParseList[index][key]"></input>
</div>
</div>
这篇关于vue.js - 怎么再v-for循环中进行v-model数据绑定的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文