๐ A highly customized slider component
English | ็ฎไฝไธญๆ | ะ ัััะบะธะน
This is still in beta and may contain unexpected bugs, please use with caution.
$ yarn add vue-slider-component@next
# npm install vue-slider-component@next --savevalue->modelValue. (Official API Changes)
- ๐ More customizable
- ๐ Multiple style themes
- ๐ณ Support for more sliders
- ๐ Add marks
- ๐ Support SSR
- ๐ Support Typescript
Document: https://nightcatsama.github.io/vue-slider-component
Live Demo: https://jsfiddle.net/NightCatSama/2xy72dod/10547/
$ yarn add vue-slider-component
# npm install vue-slider-component --saveVue 2
<template> <vue-slider v-model="value" /> </template> <script> import VueSlider from 'vue-slider-component' import 'vue-slider-component/theme/antd.css' export default { components: { VueSlider, }, data() { return { value: 0, } }, } </script>
Vue 3
<template> <vue-slider v-model="value" /> </template> <script setup> import { reactive, toRefs } from 'vue' import VueSlider from 'vue-slider-component' import 'vue-slider-component/theme/antd.css' export default { setup() { const data = reactive({ value: 0 }) return toRefs(data) }, } </script>
Detailed changes for each release are documented in the release notes.
If my code has helped you, please consider buy me a coffee โ.