有一个表单:

<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. Vue--- 使用vuex使用流程 1.0

    Vuex 1.安装vuex npm install  -save vuex 2. 引入 创建store文件夹目录 创建 vuex     指挥公共目录    store['state','action ...

  2. 【模板】素数测试(Miller-Rabin测试)

    基础素数测试模板 对于大数的素性判断,目前Miller-Rabin算法应用最广泛.一般底数仍然是随机选取,但当待测数不太大时,选择测试底数就有一些技巧了.比如,如果 被测数小于4759123141,那 ...

  3. JDK1.8的安装

    [环境准备] OS版本:Windows10企业版.64位操作系统: JDK版本:jdk-8u131-windows-x64.exe [彻底卸载已安装的JDK] 01:卸载或删除JDK服务.有三种方式: ...

  4. 模块importlib介绍

    importlib包的目的是双重的.一个是在Python源代码中提供import语句(以及扩展名为__import__()函数)的实现.这提供了可以移植到任何Python解释器的import的实现.这 ...

  5. 转:java中的定时任务

    引自:http://www.cnblogs.com/wenbronk/p/6433178.html java中的定时任务, 使用java实现有3种方式: 1, 使用普通thread实现 @Test p ...

  6. sax技术解析xml下jaxp解析器详细代码

    *解析xml的两种技术dom和sax dom:根据xml的层级结构在内存中分配一个树形结构,把xml标签,属性,文本封装成对象. sax方式:事件驱动,边读边解析. 在javax.xml.parser ...

  7. Hadoop(10)-HDFS的DataNode详解

    1.DataNode工作机制 1)一个数据块在DataNode上以文件形式存储在磁盘上,包括两个文件,一个是数据本身,一个是元数据包括数据块的长度,块数据的校验和,以及时间戳. 2)DataNode启 ...

  8. Python基本数据类型(一)

    我会持续更新.... 字符串类型 字符串定义: 字符串的格式:'字符串', "字符串", """字符串"""字符串一旦被 ...

  9. python3 练习题100例 (二十四)打印完数

    完数:一个数如果恰好等于它的因子之和,这个数就称为"完数".例如 6 = 1+2+3. 题目内容: 输入一个正整数n(n<1000),输出1到n之间的所有完数(包括n). 输 ...

  10. 内存泄漏导致程序killed

    示例程序: #include<stdio.h> #include<unistd.h> int main() { ) { *]; } ; } 执行结果: 程序消耗完内存会被kil ...