提交表格之后,当在打开页面之后,仍然有历史数据保留,本文提供两种方式进行表单清空重置
1.使用 resetFields()方法(推荐,代码简单)
<html>
<jc-form
ref="taskAdderForm" //ref是必要时,用来指定要重置的位置
:model="taskData"
label-width="100px">
<jc-form-item
label="目标库:"
prop="databaseName"> //prop是必要的,通过prop制定要重置的内容
<jc-input v-model="taskData.databaseName"/>
</jc-form-item>
</jc-form>
<div slot="footer">
<jc-button @click="cancel('taskAdderForm')">取 消</jc-button>
</div>
<JS>
methods: {
cancel(value) {
this.$emit('cancel')
this.$refs[value].resetFields()
}
}
2.在初始时候保留原始值,在之后进行赋值
<JS>
created(){
this.defaultTaskData = this.taskData //保留初始值
},
methods:{
cancel() {
this.taskData = this.defaultTaskData //进行赋值,清空已有数据
}
}