اسلایدر محدوده

اسلایدر محدوده به 3 حالت هست که حالت اول به صورت ساده است و فقط برای انتخاب محدوده است که برای استفاده از این حالت نیازی به اضافه کردن آپشن خاصی نیست و بصورت پیش فرض از این حالت استفاده میشود.

حالت دوم بصورت جدا شده است که محدوده را به 4 قسمت تقسیم کرده و برای نمایش و درک بهتر کاربر است و دارای راهنما هنگام drag است که برای استفاده از این حالت باید کلاس b_slider-seprate را اضافه کرده تا استایل موررد نظر را دربرگیرد و slot مربوطه را باید استفاده کرد تا راهنما درصد یا مبلغ انتخابی نمایش داده شود.

حالت سوم علاوه بر دارا بودن ویژگی های حالت 2 دارای درصد یا مبلغ انتخابی در پایین اسلایدر محدوده است که در این صورت هم باید کلاس b_slider-seprate را اضافه کرد و از کلاس b_slider-percent در فرزند component باید استفاده کرد تا استایل مربوطه را دربرگیرد.

حالت ساده و پیض فرض

حالت راهنما

حالت راهنما و نمایش ثابت

10% 100%

حالت متفاوت

لیست کلاس ها

# غیرفعال

  • disabled

- میتوانید از props و " disabled " برای غیرفعال کردن اسلایدر محدوده استفاده کنید.

لیست Directive ها

#ltr کردن اسلایدر در حالتی که سایت rtl هست

  • v-range-slider-ltr

برای اینکار ابتدا باید فایل range-slider-ltr.js رو از پوشه ی plugin به nuxt.config.js اضافه کنیم