javascript - 在 vue-rangedate-picker (Vuejs) 中清除选定的范围选择器
问题描述
我想通过单击清除按钮清除我的 <VueRangedatePicker @selected="updateDatePicker"> 中的选定日期。但是,当我这样做时。数据已经为空,但显示未清除所选值。有人能帮我吗?谢谢
您可以在此处访问代码:
https://codesandbox.io/s/stoic-sky-3uwch?file=/src/App.vue:0-966
这是代码:
<template>
<div id="app">
<VueRangedatePicker @selected="updateDatePicker"></VueRangedatePicker>
<button class="button" @click="cleardata()">Clear</button>
</div>
</template>
<script>
import VueRangedatePicker from "vue-rangedate-picker";
export default {
name: "App",
components: {
VueRangedatePicker,
},
data() {
return {
datepicker: null,
};
},
methods: {
cleardata() {
this.datepicker = null;
},
updateDatePicker(value) {
console.log("updating datepicker value");
this.datepicker = value;
console.log("DATE PICKER", this.datepicker);
console.log("start: " + this.datepicker.start);
console.log("end: " + this.datepicker.end);
},
},
};
</script>
<style>
#app {
font-family: "Avenir", Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
解决方案
我认为您需要取消 2 日期,因为您正在使用日期范围
cleardata() {
this.datepicker.start = null;
this.datepicker.end = null;
},
推荐阅读
- python - Pandas:是否可以在 Jupyter Notebook 中创建类似 Excel Slicer 的(交互式过滤器)?
- java - JavaFX 添加线程
- python - Python使用def函数创建不同的变量
- apache-spark - 时间列应该使用什么数据类型
- c++ - 如何使用 gdb 查看 boost::multi_index 散列索引的数据
- python - 如何在 pytorch 中逐步增长神经网络?
- node.js - 如何在我的共享托管服务器上设置我的 react/redux/express 应用程序?
- tensorflow - LSTM 批量大小和序列长度如何影响内存
- angular - 当我编辑另一个属性时,mat-option 的值消失了
- unity3d - 大量 3D 模型文件可以冻结 Unity 编辑器和 Jetbrains Rider