el-form form reset resetFields does not take effect

Project scenario:

 I encountered a problem some time ago. After the page was refreshed, I selected a piece of data for the first time, opened the editing pop-up window, and then closed it. After opening the new pop-up window, it should be the empty el-form form or the data when it was just opened for editing, and every time I close the pop-up window, I will use this.$refs[formName].resetFields() to reset the el-form. -form, so what is causing this?


Problem Description

After many tests, it was found that after the first click to add a pop-up window, there is no problem with the subsequent el-form form reset. Only the first click to edit will cause problems.


Cause Analysis:

This is because when we open the edit pop-up window for the first time after the page is refreshed, el-dialog is loaded lazily. The data in this line assigns a value to el-form, and then el-dialog is rendered. el-form has just completed initialization, so this el-form form will take effect every time it is initialized using this.$refs[formName].resetFields(), but the initialized value is the first data.


solution:

 So what is the solution?

We only need to assign values ​​after el-dialog rendering is completed.

this.visible = true 
setTimeout(()=>{
    this.form.name = row.name
    this.form.sex = row.sex
},100)

Guess you like

Origin blog.csdn.net/systemdowm/article/details/126373127