el-dialog弹框关闭清空form表单并清空验证
cancelDialog(diaLog, formRef) {this[diaLog] = falseif (formRef) {this.$refs[formRef].resetFields()}
}
页面使用：
<el-dialog :visible.sync="addSubsidyDialog.dialog" @close="cancelDialog(addSubsidyDialog.dialog, 'subsidyRef')"
><el-form ref="subsidyRef"></el-form>
</el-dialog>
@close传参说明：
需要关闭的弹窗this、关闭后需要清空的form表单
el-date-picker限制结束时间不能小于开始时间
template：
<div><el-date-pickerv-model="innerBeginDate"type="date"placeholder="开始日期"value-format="yyyy-MM-dd":picker-options="pickerStartOptions(innerEndDate)":editable="false"/><span class="ml10 mr10">-</span><el-date-pickerv-model="innerEndDate"type="date"placeholder="结束日期"value-format="yyyy-MM-dd":picker-options="pickerEndOptions(innerBeginDate)":editable="false"/>
</div>
方法：
pickerStartOptions(endTime) {return {disabledDate(time) {if (endTime) {return time.getTime() > new Date(endTime).getTime()}}}
},
pickerEndOptions(startTime) {return {disabledDate(time) {if (startTime) {return time.getTime() < new Date(startTime).getTime()}}}
},
表单筛选项重置
resetQuery() {this.queryParam = this.$options.data().queryParamthis.handleQuery()
}
以下方法自行修改
queryParam为 form表单筛选对象
handleQuery为 重置后重新搜索
过滤掉对象空值
filterNonEmptyValues(obj) {return Object.fromEntries(Object.entries(obj).filter(([_, value]) =>value !== null &&value !== undefined &&!(typeof value === 'string' && value.trim() === '') &&!(Array.isArray(value) && value.length === 0)))
}
页面使用：
const obj = {a: '',b: [],c: null,d: undefined,f: 123,e: 789,q: ' '
};const filteredObj = filterNonEmptyValues(obj);
console.log(filteredObj);输出：
{f: 123,e: 789
}
感谢你的阅读，如对你有帮助请收藏+关注！
只分享干货实战和精品，从不啰嗦！！！
如某处不对请留言评论，欢迎指正~
博主可收徒、常玩QQ飞车，可一起来玩玩鸭~
