Disabled mark

[dgaspar]

I have a slider that "adsorbs" to the marks and I would like to have disabled marks, meaning that the value land on those. Any easy ways of implementing that?

Example: A slider that goes from 0 to 100, with marks : [0, 10, 20, ..., 90, 100]
I would like marks 90 and 100 to be shown, but as "disabled".

[NightCatSama]

Can use marks, both object and function.

example: https://jsfiddle.net/70Lc5esh/
document: https://nightcatsama.github.io/vue-slider-component/#/basics/marks

[dgaspar]

Thanks for the fast response! I got the marks part working,
but I also needed to forbid setting those 90 and 100 values (even though they're part of the slider, they should be "disabled"). Is that currently possible?

[NightCatSama]

What is the specific behavior of "disabled"?

Use dotOptions to limit the range of the slider.

If you want to limit some specific values, you can use @change to judge it.
https://jsfiddle.net/wtLz685x/.

[dgaspar]

Thanks, I was missing the this.$nextTick(...) in @change.

One last detail, and it's probably unrelated to the main topic,
but I don't understand why in this example https://jsfiddle.net/okyuwrm7/ I can't change the slider value unless I click on the progress! Dragging the dot doesn't work.
It seems to boil down to combining marks, lazy and included: http://jsfiddle.net/j3av0e8u/

[NightCatSama]

Thanks for your feedback, fixed in version 3.0.46.

[dgaspar]

thanks, that fixed it!