vue中表单的动态绑定

有一个表单：

<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会检测到

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

036——VUE中表单控件处理之动态绑定文章的属性的处理方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
037——VUE中表单控件处理之表单修饰符：lazy/number/trim
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
035——VUE中表单控件处理之使用vue控制select操作文字栏目列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
034——VUE中表单控件处理之使用vue控制radio表单的实例操作
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
032——VUE中表单控件处理之复选框的处理
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
031——VUE中表单控件处理之使用vue控制input和textarea表单项
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
Vue中表单校验
1.安装校验插件vee-validate npm install vee-validate --save 2.在main.js中引用插件 // 表单校验 import VeeValidate, { V ...
vue 中表单 [v-bind:true-value="a" v-bind:false-value="b"] 的用法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
做一个gulp+webpack+vue的单页应用开发架子
1.目标最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...

随机推荐

HTML5新标签的兼容性处理
普通浏览器普通不支持HTML5新标签的浏览器 -- 能正常解析,但会当初成 inline 元素对待在不支持HTML5新标签的浏览器里,会将这些新的标签解析成行内元素(inline)对待,所以我们只 ...
c++ 数字和字符串的相互转换
需要包含头文件<sstream> 字符串转化为int #include<stdio.h> #include<string.h> #include<iostre ...
windows 开启 nginx 监听80 端口以及禁用 http 服务后，无法重启 HTTP 服务，提示系统错误 123，文件目录、卷标出错
1. 正常情况直接运行 start nginx.exe 不能开启成功,因为 80 端口被占用.提示: bind() to 0.0.0.0:80 failed (10013: An attempt w ...
Failed to introspect bean class [org.springframework.orm.hibernate5.LocalSessionFactoryBean] for lookup method metadata: could not find class that it depends on; nested exception is java.lang.NoClass
依赖引入错误可能版本不对 Failed to introspect bean class [org.springframework.orm.hibernate5.LocalSessionFact ...
sax技术解析xml下jaxp解析器详细代码
*解析xml的两种技术dom和sax dom:根据xml的层级结构在内存中分配一个树形结构,把xml标签,属性,文本封装成对象. sax方式:事件驱动,边读边解析. 在javax.xml.parser ...
[MIP]mip-script组件自定义 JS 代码使用限制
自mip升级v2版本后,多了一个mip-script组件,很多人就都以为可以写自定义js代码了!然并卵,MIP2页中还是一样不允许自定义javascript代码,所有的交互须通过组件实现. 引用官方说 ...
C语言Windows程序开发—CreateWindow函数介绍【第03天】
(一)CreateWindow函数的参数介绍: HWND CreateWindow( LPCTSTR lpClassName, //Windows窗口中预定义的控件结构体,包括:BUTTON(按钮), ...
JavaScript之this解析
1.解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的上下文对象,根据函数的调用方式不同,this会指向不同的对象 ...
C语言实例解析精粹学习笔记——36（模拟社会关系）
实例: 设计一个模拟社会关系的数据结构,每个人的信息用结构表示,包含名字.性别和指向父亲.母亲.配偶.子女的指针(只限两个子女).要求编写以下函数: (1)增加一个新人的函数 (2)建立人与人之间关系 ...
uva 509 RAID!（磁盘数据）
来自 https://blog.csdn.net/su_cicada/article/details/80085318 习题4-7 RAID技术(RAID!, ACM/ICPC World Final ...

vue中表单的动态绑定

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

随机推荐

热门专题