在做学习时用到了resetFields对表单进行重置,结果一直不成功,后来找到了出错的地方,分析一下原因
<el-dialog title="修改地址" @close="addressDialogClosed"
:visible.sync="addressDialogVisible"
width="50%">
<el-form ref="addressFormRef" :model="addressForm" label-width="100px" :rules="addressFormRules">
<el-form-item label="省市区/县" :prop="address1">
<el-cascader :options="cityData" clearable
v-model="addressForm.address1">
</el-cascader>
</el-form-item>
<el-form-item label="详细地址" :prop="address2">
<el-input v-model="addressForm.address2"></el-input>
</el-form-item>
</el-form>
<div slot="footer">
<el-button @click="addressDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="addressDialogVisible = false">确 定</el-button>
</div>
</el-dialog>
addressDialogClosed () {
this.$refs.addressFormRef.resetFields()
}
出错原因是在el-form-item中对数据动态绑定了,:prop=“address1”,把数据记录到了addressForm中,结果下次打开的时候还有数据。
修改过后应该是
<el-form-item label="省市区/县" prop="address1">//把:移除了