vue-number-spinner

0.0.2 • Public • Published

vue-number-spinner

npm Download GitHub license GitHub stars

Number spinner component for Vue.js. The number stepper widget, It allows users to type a value directly, or modify an existing value by spinning with the keyboard, mousewheel.

NPM

Installation

npm i vue-number-spinner -S

Import

ES6

import vueNumberSpinner from 'vue-number-spinner'

CommonJS

var vueNumberSpinner = require('vue-number-spinner');

script

<script type="text/javascript" src="vue/dist/vue.min.js"></script>
<script type="text/javascript" src="vue-number-spinner/dist/vue-number-spinner.min.js"></script>
<script type="text/javascript">
    var vueNumberSpinner = window['vue-number-spinner'];
</script>

Basic Usage

script

new Vue({
  el: 'body',
  components: { vueNumberSpinner }
});

html

<!-- step by 1 -->
<vue-number-spinner :min=0 :max=10 :step=1></vue-number-spinner>
<!-- step by 5 -->
<vue-number-spinner :min=0 :max=100 :step=5></vue-number-spinner>

Props

Name Type Desc Example
min Number The min value 0
max Number The max value 100
step Number Increment/Decrement the value by step number 5

keyboard/mousewheel interaction

  • Up Increment the value by one step.
  • Down Decrement the value by one step.

License

MIT

Readme

Keywords

Package Sidebar

Install

npm i vue-number-spinner

Weekly Downloads

3

Version

0.0.2

License

MIT

Last publish

Collaborators

  • xiaoluoboding