How to set the disabledDate? of a date after the type of the date selector in ivew is daterange

uses ivew"s date selector plug-in in the project, and has set the initial unselectable date through the official example, but since the required plug-in type in the project is daterange, the @ on-change event can only be triggered after two dates have been selected. But now there is a new requirement that after a date is selected, the range beyond 30 days before and after that date is automatically set to disable selection.

the following is the code 

<DatePicker @on-ok="selectTime" 
    @on-change="onTimeChange" 
    :options="datePickerOption" 
    placement="bottom-end" 
    v-model="isTime" 
    class="selectMyTime" 
    confirm type="daterange" 
    format="yyyy-MM-dd" 
    placeholder="" 
></DatePicker>

<script>
module.exports={
    data:function() {
        return{
            datePickerOption: {
                disabledDate (date) {
                    return date && date.valueOf() < 1514736000000 || date && date.valueOf() > Date.now() + 604800000;
                }
            }
        },
    }
    methods:{
        onTimeChange: function(isTime) {
            this.datePickerOption = {
                disabledDate(date) {
                    return date && date.valueOf() < 1514736000000 || date && date.valueOf() < isTime - 2592000000 || date && date.valueOf() > isTime + 2592000000;
                }
            }
        },
    }
}
</script>

the method like above failed because it could not be executed until two dates were obtained.

is there any way to call a function method after clicking to select a date without changing the type="daterange"?

Vue.js
Jul.04,2021

Previous: What are the tcp,udp ports to be used by workerman

Next: When vue router jumps to a page, it occasionally returns to the route when it opens a new window.

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu