zoukankan      html  css  js  c++  java
  • el-form的resetFields()方法不生效的原因及解决方法

    1.prop属性值需要与form中的key字段保持性一致

    2.当页面是编辑页面的时候打开弹框使用

    this.$refs.proTypeForm.$refs.checkform.resetFields()的方式调用的话 会发现重置按钮不生效,具体是由于该方法的底层机制导致
    原因是form表单的重置是以第一次打开的数据作为重置标准,如果先打开的是更新,那么重置之后以第一次更新的数据作为标准;
    Dialog 中的内容是懒加载的,目前 edit (更新)方法的写法导致 Form 刚加载出来时值就已经是新的了,所以 resetFields 也只能重置到初始化的页面值即第一次显示的数据

    解决方法

      2.1重写form表单的resetFields() 

     resetFields() {

      this.$set(this.ruleForm, 'build', '')
    this.$set(this.ruleForm, 'buildChild', [])
    this.$set(this.ruleForm, 'operate', [])
    this.$set(this.ruleForm, 'service', [])
    },

    2.2在获取表单数据的的时候利用this.$nextTick()
    watch: {
    proDataForm: {
    handler() {
    this.$nextTick(()=>{
    this.ruleForm = this.proDataForm
    })
    },
    immediate: true
    }
    },
    代码搬运工
  • 相关阅读:
    php文件 基本语法
    DBDA类 连接数据库 返回Json 返回字符串
    全选复选框做法
    弹窗js
    AJAX
    弹窗JS CSS
    JavaScript
    链接数据库 类
    PHP 分页 查询
    Foreach嵌套Foreach
  • 原文地址:https://www.cnblogs.com/tw6668/p/15357191.html
Copyright © 2011-2022 走看看