热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

vue.js关于循环出来多个input并让每个input后的修改按钮控制其值

从后端返回的数据中,有时候你会遇到一堆的input,然后每个input后面都跟有一个按钮,就像这种情况其中有两个问题,1:在一个框里面输入值,然后所有的值都都会显示你输入的结果2:

从后端返回的数据中,有时候你会遇到一堆的input,然后每个input后面都跟有一个按钮,就像这种情况
《vue.js关于循环出来多个input并让每个input后的修改按钮控制其值》

其中有两个问题,1:在一个框里面输入值,然后所有的值都都会显示你输入的结果 2:每个输入框点击能控制所有的input而不只是它前面的那一个
其实解决也不复杂,主要是运用到了循环以及index指数的功能,下面开始上代码,首先把它遍历出来




后台给我的数据是个对象,我用的是for in遍历出来,这个newData是走ajax请求来的数据

for(var x in newData){
newData[x].value='';
}

然后数据中的每个对象都加上了这个value属性,接下来就好办啦,点击之后走个方法,直接获取

amendCardNum(index){
var v=this.bstp[index].value;
console.log(v)
}

大家做项目的时候一定要多想操作数据而不是操作dom,我之前就是陷到操作dom里面,要用for获取那个输入框的value之类的,然后越陷越深,这都是用jquery留下的后遗症,大家一定要注意,vue尽量不要用jquery,一切以操作数据为主而不是dom


推荐阅读
author-avatar
mobiledu2502918113
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有