The @change event does not emit a value of 0
peter31990 opened this issue · 9 comments
The @change event does not emit a value of 0. Why?
:min="-600"
:max="0"
When I move the slider to 0 the event is not emitted.
Can't reproduce what you said, please provide the online example.
I noticed this when I didn't have a v-model set. Even when passing over zero from negative to positive, zero is ignored. Just set a v-mode land it fixes it though.
https://codesandbox.io/s/xenodochial-forest-3zy7by?file=/src/App.vue
Yes, because you did not set the value, the default is always 0, so the internal judgment of the component will not trigger the change event if there is no change.
I'm experiencing this as well.
@NightCatSama what about if the user changes the value from 0 to 1, then back to 0? No change event is fired, even though the value did indeed change from its previous one.
For others who might stumble upon this same issue / comment thread - you can use either v-model or the dragging event as a workaround for now:
Behaves as expected
<vue-slider v-model="foo" />
Behaves as expected
<vue-slider @dragging="onFoo" />
Does not behave as expected
<vue-slider @change="onFoo" />
@NightCatSama what about if the user changes the value from 0 to 1, then back to 0? No change event is fired, even though the value did indeed change from its previous one.
The internal determination is that there is no change, because the value/v-model is not passed, so it will always be 0 inside the component.
@NightCatSama Yeah that's the thing (unless I'm misunderstanding your reply) - the value is being passed. Here's an example of what I mean. Notice that once you switch away from 0 you can never go back again:
@callmeaponte The usage in this example is wrong. vue3 uses model-value and not value.
document: https://github.com/NightCatSama/vue-slider-component#breaking-changes
example: https://stackblitz.com/edit/vue-zuobkp?file=src%2FApp.vue
Sorry for the confusion - I'm not actually using Vue 3 in my project, I just couldn't get a Vue 2 example working on StackBlitz. Good to know about the API change though.
Either way I'll just use v-model for now, still gets the job done 😁
Sort of running into a similar issue. I initialise the slider with a value of 'undefined', and a min/max of 0-10. 0 is not selectable unless another value is selected first. I can't initialise with 0 because I need the user to explicitly set a value. How would I configure this?