el-date-picker不可清空
时间: 2023-10-07 15:05:29 浏览: 140
【JavaScript源代码】vue el-date-picker动态限制时间范围案例详解.docx
el-date-picker组件在修改/编辑时,点击×无法清空,并且重新选择新的日期范围也不显示的问题可能由于赋值方式不正确导致。在回显数据时,el-date-picker绑定的变量应该是一个数组形式,但是如果赋值方式不正确,很可能导致无法清空的问题。解决这个问题的方法是在为value重新赋值之前,将开始日期和结束日期绑定的值置为空。例如,在watch中监听time_value变量的改变,如果newData为空,则将开始日期和结束日期的值都置为空。然后再进行日期格式转换和其他操作,最后重新初始化数据。这样就可以成功清除el-date-picker的值。从另一个角度来分析,新增时不会出现这种问题,而编辑/修改时会出现,主要区别在于回显数据。el-date-picker绑定的变量应该返回一个数组,但是在编辑/修改时,赋值给el-date-picker的变量可能是一个对象,这样就会导致问题。因此,正确的赋值方式非常重要。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [vue中el-date-picker 编辑时clearable无法清空](https://blog.csdn.net/PJL13411055804/article/details/128283966)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* [vue element-ui el-date-picker日期选择器 清空按钮之坑](https://blog.csdn.net/li222248/article/details/115414230)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文