vue-number-directive
TypeScript icon, indicating that this package has built-in type declarations

0.0.5 • Public • Published

vue-number-directive

npm Version GitHub License Build Status Coverage Status

A Vue plug-in to keep the input content as Number string

English Doc|中文文档

examples & docs

[TOC]

Install

Node (use as a dependency in packaging system)

# with `yarn`:
yarn add vue-number-directive
# or with `npm`:
npm install vue-number-directive --save

browser

Use the umd.js file in dist/, refer to UMD example

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-number-directive"></script>

<script>
  // The global name of the plugin is `VueNumber`.
  Vue.use(VueNumber)
</script>

Usage

Global plug-in

import Vue from 'vue'
import NumberDirective from 'vue-number-directive'
// If you want to use source code for projects with esm packaging system, import src file
// import NumberDirective from 'vue-number-directive/src/index'

Vue.use(NumberDirective, globalOptions)

Directive only

import Vue from 'vue'
import { NumberDirective } from 'vue-number-directive'

Vue.directive('{{name}}', NumberDirective)
// or use as a local directive
export default {
  directives: {
    number: NumberDirective
  }
}

API

Options

Refer to input example, supported options are shown in Controls

optimizeOptions(
  mergeOptions(
    {
      el,
      vnode,
      debug: config.debug,
      modelPropPath,
      scope: config.scope,

      integer,
      positive,
      fixed: config.fixed,
      flag: config.flag,
      min: config.min,
      max: config.max,
      minimum: config.minimum,
      maximum: config.maximum,
      // exclusiveMinimum,
      // exclusiveMaximum,
      sep: config.sep
    },
    parseSchema(config.schema),
    globalOptions
  )
)

Directive modifiers

int

Whether is a integer

pos

Whether is a positive number

Features

supported element

<input>

only supports the following input types:

  • text,
  • tel,
  • password
  • search
  • hidden, or
  • no type specified at al

<textarea>

contenteditable element

Element with a true contenteditable attribute

Vue component

Vue component that contain the above elements

  • such as ElementUI’s Input and NumberInput

Maintainers

@Awam M Wang

Contributing

See the CONTRIBUTING file

PRs accepted.

ChangeLog

see the CHANGELOG file

License

MIT © 2020 Awam M Wang

Readme

Keywords

none

Package Sidebar

Install

npm i vue-number-directive

Weekly Downloads

1

Version

0.0.5

License

MIT

Unpacked Size

197 kB

Total Files

39

Last publish

Collaborators

  • wangnew2013