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>
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了Vue3.x源码调试的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-10-10
npm如何更新VUE package.json文件中依赖的包版本
这篇文章主要介绍了npm如何更新VUE package.json文件中依赖的包版本问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-06-06
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
本文讲述如何实现拥有酷炫背景视频的登录页面，浏览器窗口随意拉伸，背景视频及前景登录组件均能完美适配，背景视频可始终铺满窗口，前景组件始终居中，视频的内容始终得到最大限度的保留，可以得到最好的视觉效果2018-01-01
这篇文章主要介绍了vue之this.$router.push页面刷新问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-12-12
vue2.0在没有dev-server.js下的本地数据配置方法
这篇文章主要介绍了vue2.0在没有dev-server.js下的本地数据配置方法的相关资料，非常不错，具有参考借鉴价值,需要的朋友可以参考下2018-02-02
这篇文章主要介绍了vue实现虚拟化列表封装方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
文件上传在很多项目中都用的到，如果是几M的很快就传送完毕，如果是大文件呢？本文就介绍了Vue 大文件上传和断点续传的实现，感兴趣的可以了解一下2021-06-06
平常的vue项目开发,已经很难遇见一千行,甚至几千行代码的页面了,毕竟大家都会去拆分组件,下面这篇文章主要给大家介绍了关于vue3动态加载组件以及动态引入组件的相关资料,需要的朋友可以参考下2023-03-03
这篇文章主要介绍了解决vue表单为空也能提交的问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
这篇文章主要介绍了关于vue项目proxyTable配置和部署服务器的问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
最新评论