Vue2 iOS Style Picker Component
Scroll Picker Component for Vue2. Support All Gestures of Mouse(even also MouseWheel!) and Touch.
Vue Scroll Picker
Scroll Picker Component for Vue2. Support All Gestures of Mouse(even also MouseWheel!) and Touch.
Examples
Installation
npm i vue-scroll-picker
Usage
CSS
Import css file (only version v0.2
or later).
import "vue-scroll-picker/dist/style.css"
ES6
import Vue from "vue"
import VueScrollPicker from "vue-scroll-picker"
Vue.use(VueScrollPicker)
or
import Vue from "vue"
import { ScrollPicker, ScrollPickerGroup } from "vue-scroll-picker"
new Vue({
components: {
ScrollPicker,
ScrollPickerGroup,
}
})
Globals
<html>
<head>
...
</head>
<body>
<div id="app">
<scroll-picker :options="[1, 2, 3, 4, 5]"></scroll-picker>
</div>
<script src="path/to/vue.js"></script>
<script src="path/to/vue-scroll-picker.js"></script>
<script>
new Vue({ el: "#app", })
</script>
</body>
</html>
Options
Props
Props | Type | Default | Description |
---|---|---|---|
value | mixed | null | set value |
placeholder | String | null | placeholder |
options | Array | [] | options of value. example, ["10KG", "20KG", "30KG"] or [{value: 10, name: "10KG"}, {value: 20, name: "20KG"}] |
Event
-
@input
: you can usev-model
:-)
Styling
- rscss
- Vue Loader Deep Selector : if you want to override css style, use deep selector in vue-loader!
License
MIT
Github Repository
Tags: #VueJs