zoukankan      html  css  js  c++  java
  • Element form表单方法resetFields无效

    之前遇到resetFields无效时都是自己手动用this.ruleForm = Object.assign({}, this.ruleForm, this.$options.data().ruleForm) 这种方式来清数据,用了这么久的form表单,resetFields真的是有时候生效有时候又不生效的,于是看了下Element源码,终于发现了其中的奥秘
    源码的form-item在mounted的时候是这么写的

    mounted() {
          if (this.prop) {
            this.dispatch('ElForm', 'el.form.addField', [this]);
    
            let initialValue = this.fieldValue;
            if (Array.isArray(initialValue)) {
              initialValue = [].concat(initialValue);
            }
            Object.defineProperty(this, 'initialValue', {
              value: initialValue
            });
    
            this.addValidateEvents();
          }
        },
    

    可以看到整个mounted操作都是基于你定义了prop才可以的,之后就是定义一个initialValue初始值,使用Object.defineProperty来定义默认是不可修改的,加writable属性值才能修改,并且放到this下,然后执行resetFields时把值变成初始值,所以以后需要清空表单,又不想手动清空的那么prop是必须要定义了

  • 相关阅读:
    Vue基础第三章
    Vue基础第二章
    Vue基础第一章
    AWS笔记
    导入Dynamic Web Project后程序有红叉但是可以运行
    JSTL配置文件下载地址
    access纯jdbc连接
    XML学习总结二——DTD
    【转】无题
    XML学习总结一
  • 原文地址:https://www.cnblogs.com/wzcsqaws/p/11493162.html
Copyright © 2011-2022 走看看