标签：mounted form resetFields 初始值 表单 ui element 赋值

1.问题

触发bug的条件是先打开，编辑进行赋值，后打开新增

先点开编辑

 再打开新增

这个时候你会发现刚刚赋值过的数据还遗留在表单里面

 即使在打开  dialog  的时候执行了重置也没有效果

resetForm(formName) {
    if (this.dialogStatus === 'create') {
      this.$nextTick(() => {
        this.$refs[formName].resetFields()
      })
    }
},

2.关于resetFields()方法

1. 此方法用于将form表单的数据设置为初始值
2. 而这个初始值是在form mounted生命周期被赋值上去的
3. 所以，在 form mounted之前，如果给form表单赋值了，那么后面调用resetFields()都是无效的，因为form表单的初始值已经在 mounted 之前就被赋值了

3.解决办法

所以我们要在 form 表单 mounted之后再进行赋值操作这样就可以完美解决问题了
在点击编辑赋值的时候使用 “this.$nextTick” 方法即可

handleEdit(row) {
    this.dialogStatus = 'update'
    this.dialogFormVisible = true
    this.$nextTick(() => {
        this.temp = Object.assign({}, row)
    })
    // this.temp = Object.assign({}, row)
},

标签：mounted,form,resetFields,初始值,表单,ui,element,赋值
来源： https://www.cnblogs.com/cherylgi/p/14785842.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。