一个用来格式化数字的Vue指令插件; Vue directi

在开发新的独立插件vue-number-directive,已经完成基础功能,正在添加测试。该插件不再更新

vue-autonumeric-directive

example

Introduction

vue-autonumeric-directive是一个基于autoNumeric的Vue插件,使用简单的指令方式,对需要的元素添加格式化功能。

Use Guide Installation

# with `yarn` : yarn add vue-autonumeric-directive # or with `npm` : npm install vue-autonumeric-directive --save How to use?

按照Vue插件方式注册插件。

在浏览器中插件的全局名称为VueNumberFormat

<input name="input1" id="input1" v-model="input1" v-number="config1">

new Vue({ el: '#demo', data: { input1: '123.00', config1: { bind: 'input1' }, input2: 32, } }) On which elements can it be used

On which elements can it be used

<input>

只支持下列input类型

text, tel, hidden, or no type specified at all 支持contenteditable元素 支持其他元素的一次性格式化 支持Vue组件

支持element-ui Input组件

Options 全局Options

export type PluginsOptions = { unsafeSet: boolean; // use unsafe method to set value to element and vnode (eval, more powerful) pure: boolean; // 是否不使用分隔符(例如千分位逗号) presion: number; // 精确到小数点后几位 } 指令Options

declare type InputOptions = { unsafeSet: boolean; bind: string; min: string, max: string, presion: string, // 精确到小数点后几位 local: string, // autoNumeric本地化配置, predifined: string, // autoNumeric预定义配置 numricOptions: AutoNumericOptions; }; local: 参考autoNumeric language options predifined: 参考autoNumeric predifined options 指令modifiers int // 整数 pure // 不使用分隔符(例如千分位逗号) ppi // pure positive integer 无分隔符正整数 numricOptions选项

参考numberic numricOptions autoNumeric options

Features 保留原事件响应 把AutoNumeric挂在了插件下 把AutoNumeric的实例挂在了对应的element下,方便调用它的方法

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。