vue v-for循环出来的数据动态绑定值问题
更新时间：2023年04月17日 14:35:57 作者：爬坑的小白
这篇文章主要介绍了vue v-for循环出来的数据动态绑定值问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
v-for循环出来的数据动态绑定值
记录一下，循环数据动态绑定值
//description这个数组是后台给的数据
//首先遍历这个数组，给这个数组加上value这个字段
for(let item of description){
item.value = ''
}//然后在input就可以绑定这个值了
<div v-for="(item,index) in description" :key="index" style="margin-top: 10px">
<span >{{item.fields_describe}}：</span>
<el-input clearable v-model="item.value" placeholder="请输入内容" size="mini" ></el-input>
</div>最后我们给后端值的时候只需要把description这个数组给他传过去就好了，里面包括input的值。
使用v-for循环的输入框，如何绑定值
问题
一堆输入框用v-for生成，怎么用v-model绑定这些输入框的值
思路
vue里面的data定义一个数组：formTextList:[]
请求到数据的时候，将后端的数组赋给前端自己定义的formTextList
v-model绑定到这个数组
代码：
<div class="mobile" v-for="item in formTextList">
<div>{{item.title}}<i v-if="item.isRequired===1">*</i></div>
<div class="mobile-input">
<input type="text" :placeholder="'请输入'+item.title" v-model="item.value">
</div>
</div>
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
文章介绍了如何使用Vue CLI 2搭建Vue项目,并添加Electron插件vue-cli-plugin-electron-builder来创建一个Vue+Electron项目,文章还提供了启动和打包项目的方法,并提示了下载国内网较慢的文件时可以先注释掉代码进行调试,感兴趣的朋友一起看看吧2025-01-01
这篇文章主要介绍了vue2中使用AntV 以g2plot为实例，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
这篇文章主要介绍了使用vuex缓存数据并优化自己的vuex-cache，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-05-05
本篇文章主要介绍了vue-validator（vue验证器）,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-01-01
这篇文章主要介绍了vue-element-admin登录全流程，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
凡事有好就又坏，想必大家都知道Vue的作用与优点，但是使用的规程中也总是有很多问题，接下来小编就来向大家讲解使用Vue时应注意的一些问题，希望能帮助到大家2021-09-09
这篇文章主要介绍了vue 重塑数组之修改数组指定index的值操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
这篇文章主要介绍了vue3 provide与inject的使用小技巧，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
vue3 使用 vue3-video-play实现在线视频播放
这篇文章主要介绍了vue3 使用 vue3-video-play 进行在线视频播放,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-06-06
vue中给el-radio添加tooltip并实现点击跳转方式
这篇文章主要介绍了vue中给el-radio添加tooltip并实现点击跳转方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-04-04
最新评论