有一个表单:

<el-form :model="configForm">

</el-form>

如果configForm初始化为{},此对象是动态变化的,如果后面赋值时,这样

this.configForm[key1] = '';
this.configForm[key2] = '';
this.configForm[key3] = ''

vue是检测不到其变化的,vue只会检测到其本身值(对象数组为指针)变化,如果是对象,可以检测初始化对象中已存在的属性变化,而不会检测到新增的属性;

此时应该这样:

var configForm = {};
configForm[key1] = '';
configForm[key2] = '';
configForm[key3] = '';

this.configForm = configForm;

给this.configForm重新赋值,指针发生变化,vue会检测到

相关学习: http://es6.ruanyifeng.com/#docs/object#%E5%B1%9E%E6%80%A7%E5%90%8D%E8%A1%A8%E8%BE%BE%E5%BC%8F

vue中表单的动态绑定的更多相关文章

  1. 036——VUE中表单控件处理之动态绑定文章的属性的处理方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 037——VUE中表单控件处理之表单修饰符:lazy/number/trim

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 035——VUE中表单控件处理之使用vue控制select操作文字栏目列表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 034——VUE中表单控件处理之使用vue控制radio表单的实例操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 032——VUE中表单控件处理之复选框的处理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 031——VUE中表单控件处理之使用vue控制input和textarea表单项

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. Vue中表单校验

    1.安装校验插件vee-validate npm install vee-validate --save 2.在main.js中引用插件 // 表单校验 import VeeValidate, { V ...

  8. vue 中表单 [v-bind:true-value="a" v-bind:false-value="b"] 的用法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 做一个gulp+webpack+vue的单页应用开发架子

    1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...

随机推荐

  1. ETO的公开赛T1《矿脉开采》题解(另类版)

    这道题别看是签到题,写起来一点不简单 出题人的正解是双向搜索 我们把物品分成两半 每一半分别跑搜索 答案存下来,用个双指针合并即可 然后我构造了两组数据卡掉了他,不得不缩小数据范围 但我这里为什么要致 ...

  2. 【CodeForces 915 C】Permute Digits(思维+模拟)

    You are given two positive integer numbers a and b. Permute (change order) of the digits of a to con ...

  3. ABAP术语-IAC (Internet Application Components)

    IAC (Internet Application Components) 原文:http://www.cnblogs.com/qiangsheng/archive/2008/02/20/107455 ...

  4. 如何解决tomcat中的应用报java.io.IOException: 您的主机中的软件中止了一个已建立的连接

    转载: 施勇: https://blog.csdn.net/shiyong1949/article/details/72845634 这两天突然看到日志文件中有“java.io.IOException ...

  5. CSS3--j惊艳到你的新前端

    一.css3的选择器 1. 父子选择器 直接关系 .box>.com 2. 兄弟选择器 相邻关系 .box+.com <span>hello</span> <p&g ...

  6. Java中Redis缓存

    1:安装 安装可分为单机版redis 和集群版redis  安装比较简单,自行百度即可 2:集成 pom文件中加入jedis 依赖,spring创建redis的application-resid配置, ...

  7. 【super vlan的配置】

    Super vlan的配置 一:根据项目需求搭建好拓扑图如下: 二:配置 1:由项目图进行理论分析:sw1属于三层交换,用于二层交换信息的转发;同时在sw1上可定义super vlan把sub vla ...

  8. thinkphp phpmailer邮箱验证

    thinkphp 关于phpmailer的邮箱验证 一  . 登陆自己的邮箱,例如:qq邮箱.登陆qq邮箱在账户设置中开启smtp服务: 之后回发送一个授权码 , 这个授权码先保存下来,这个授权码在后 ...

  9. 消费滚动滴log日志文件(flume监听,kafka消费,zookeeper协同)

    第一步:数据源 手写程序实现自动生成如下格式的日志文件: 15837312345,13737312345,2017-01-09 08:09:10,0360 打包放到服务器,使用如下命令执行,模拟持续不 ...

  10. Scrapy进阶

    当我们使用scrapy框架爬取网站的时候,我们会有一个入口的url,一个名为start_urls,我们爬取的第一个网页是从这一开始的. 需求: 现在我们有一个这样的需求,比如说我们对起始的URL有一个 ...