Requirement: The calendar selection end time is greater than or equal to the start time limit. My requirement here is that the contract start date is less than the contract end date.
If the start date is selected, the end date can only be greater than or equal to the start date.
If the end date is selected, the start date can only be less than or equal to the end date.
After reading the requirements, go directly to the code
The two triggering events are the triggering events of the contract start time and the contract end time. After the event is triggered and formatted, the value is assigned to the bound:value value and the calendar pop-up window is closed.
Then declare two variables in the data body in Vue to determine the maximum and minimum selection ranges of the contract start time and contract end time.
Then use the open trigger event of the calendar to assign the selected time range of the contract start time and contract end time variables.
Use the replace function to assign the time, for example: (2022-2-2 to 2022,2,2) to the selected time range of the contract start time and contract end time variables.
Note: This operation has compatibility issues with IOS! It is given at the bottom of Vant’s official website.
Many Vant time limits searched are based on time, but there are no calendar date limits. Hope this article can help everyone!