vue中循环时动态绑定值
在vue项目中,有很多需要动态循环绑定的场景,在未知绑定数量的情况下只能动态生成绑定值
1.首先在data中定义一个对象,我在项目中时循环绑定下拉框,所以定义了一个selectVal = {}
2.在循环时通过下标在对象中创建新的值,我循环得时数组allGoodsClass是一个二维数组,此时通过下标的方式绑定,selectVal中得值就会为selectVal0 : "xxx",selectVal1 : "xxx"
<el-select v-for="(item, index) in allGoodsClass" :key="index" v-model="selectVal['selectVal'+ index]" class="goods-select" placeholder="请选择" size="mini" @change="changeGoodsClass(index)">
<el-option
v-for="(item1,index1) in item"
:key="index1"
:label="item1.commodity_classification_name"
:value="item1.id"
/>
</el-select>
3.在change事件触发后,通过下标即可以知道当前下拉框是循环中的哪一个,此时即可通过selectVal['selectVal' + index]取出对应的值
vue中循环时动态绑定值的更多相关文章
- vue点击时动态改变样式 ------- 最简单的方法
vue点击时动态改变样式 template中 <li :class="{ active:index==isActive }" @click="changeValue ...
- C# bootstrap之表格动态绑定值
这段时间研究了下bootstrap,打算从表格开始学习,实现动态绑定值,在网上找了挺多例子,但是很少有写全的,要不就太复杂,实现效果后总结一下,直接拷贝过去可以用. 第一步:先去官网上下载bootst ...
- Vue中循环的反人类设计
今天学习Vue到循环那里,表示真是不能理解Vue的反人类设计 具体看代码吧! <!DOCTYPE html> <html> <head> <meta char ...
- 03.VUE学习之动态绑定值
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- vue中v-bind:class动态添加class
1.html代码 <template v-for='item in names'> <div id="app" class="selectItem&qu ...
- 聊聊 Vue 中 title 的动态修改
由于之前的 Vue 项目打包成果物一直是嵌入集成平台中,所以一直没有关注过项目的 title.直到最近,突然有个需求,要求点击按钮在集成平台外新开一个页面,此时我才发现,原来我的项目的 title 一 ...
- foreach循环时动态往数组里添加数据
今天在用TP做项目的时候遇到一个问题,foreach的时候需要动态往数组里添加数据,示例代码如下: $arr = array( array('id'=>'字符串1','name'=>'字符 ...
- MVC4 绑定下拉框方法,解决编辑时不绑定值
方法一 Controller 部分代码: public ActionResult Modify(int id) { //3.1.1 检查id //3.1.2根据id查询数据 Models.Stude ...
- vue处理循环列表动态数据问题
调用方法:Vue.set( target, key, value ) target:要更改的数据源(可以是对象或者数组) key:要更改的具体数据 value :重新赋的值 <!DOCTYPE ...
随机推荐
- OcelotAPI 简单使用—服务发现、流控
我这人比较懒 直接上配置文件的图 其中serviceName是服务名称, LoadBalancer是负载均衡策略. 对于流控我为了做测试写的1s 限制5次请求. 剩下的看名字就OK了. 要使用服务发现 ...
- On ROWNUM and Limiting Results
This issue's Ask Tom column is a little different from the typical column. I receive many questions ...
- Python 008- 游戏2048
#-*- coding:utf-8 -*- import curses from random import randrange, choice # generate and place new ti ...
- Spring整合Struts2的方法
一.基本支持 通常我们整合Spring和struts2的目的是让Spring来管理struts2的控制器.也就是说把Action交由Spring来管理,利用IOC的特性把Action注入到业务逻辑中. ...
- tornado之异步web服务一
大部分Web应用(包括我们之前的例子)都是阻塞性质的,也就是说当一个请求被处理时,这个进程就会被挂起直至请求完成.在大多数情况下,Tornado处理的Web请求完成得足够快使得这个问题并不需要被关注. ...
- 11、JavaScript 比较和逻辑运算符
- Break、Continue、Return区别
1)break 直接跳出当前的循环,从当前循环外面开始执行,忽略循环体中任何其他语句和循环条件测试.他只能跳出一层循环,如果你的循环是嵌套循环,那么你需要按照你嵌套的层次,逐步使用break来 ...
- Spring AOP-xml配置
在spring AOP(一)中介绍了AOP的基本概念和几个术语,现在学习一下在XML中如何配置AOP. 在XML中AOP的配置元素有以下几种: AOP配置元素 描述 <aop:config> ...
- java中String.valueOf(obj)、(String)obj与obj.toString()有什么区别
方法1:采用 Object.toString()方法 在这种使用方法中,因为java.lang.Object类里已有public方法.toString(),所以对任何严格意义上的java对象都可以调用 ...
- Android 启动过程介绍【转】
本文转载自:http://blog.csdn.net/yangwen123/article/details/8023654 一般开机过程大致可以分为三个大阶段: 1. OS级别,由bootloader ...