You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The UI does not update when the model value's start/end are programmatically set to undefined, even though the model value does actually change.
Expected behavior
The selected range should be cleared when the 'clear' button is clicked.
Context & Screenshots (if applicable)
I think the root cause here is that the range calendar tries to completely clear its selection by setting the model value to { start: undefined, end: undefined } when a user starts a new selection. This means that while the selection is in progress, the value of the internal startValue does not match the value in the model, even though the watch that keeps them in sync is still active.
I'm guessing that undefined modelValue.start/end values are ignored in order to prevent them from overwriting startValue during the selection, but it seems more reasonable to me to just keep startValue always in sync with modelValue.start by setting modelValue to { start: startValue.value, end: undefined } until the selection is completed. Then, it's up to the caller to handle partial selections as needed.
Btw, here are some ways that partial selections may need to be handled for various use cases:
treat as start/end undefined (current behavior)
treat as a range where start == end
allow partial selection with end: undefined
allow partial selection with start: undefined
ignore and use previous selection instead
ignore and use default value instead
a date range picker in a popup may need to ignore the partial selection while the popup is open, but commit a value that matches one of the above if the selection is still partial when the popup closes, and may also need different functionality if the selection is cancelled with the esc key
Since there are many ways partial selections may need to be handled, I think it makes the most sense to just expose them to the caller and let them deal with it rather than trying to do anything "intelligent."
The text was updated successfully, but these errors were encountered:
Environment
Link to minimal reproduction
https://stackblitz.com/edit/sjvn9m-8dgymjir?file=src%2FApp.vue,package.json
Steps to reproduce
Describe the bug
The UI does not update when the model value's start/end are programmatically set to undefined, even though the model value does actually change.
Expected behavior
The selected range should be cleared when the 'clear' button is clicked.
Context & Screenshots (if applicable)
I think the root cause here is that the range calendar tries to completely clear its selection by setting the model value to
{ start: undefined, end: undefined }
when a user starts a new selection. This means that while the selection is in progress, the value of the internalstartValue
does not match the value in the model, even though the watch that keeps them in sync is still active.I'm guessing that undefined
modelValue.start/end
values are ignored in order to prevent them from overwritingstartValue
during the selection, but it seems more reasonable to me to just keepstartValue
always in sync withmodelValue.start
by settingmodelValue
to{ start: startValue.value, end: undefined }
until the selection is completed. Then, it's up to the caller to handle partial selections as needed.Btw, here are some ways that partial selections may need to be handled for various use cases:
Since there are many ways partial selections may need to be handled, I think it makes the most sense to just expose them to the caller and let them deal with it rather than trying to do anything "intelligent."
The text was updated successfully, but these errors were encountered: