Vue数字输入限制自定义指令(限制最小数\最大数\小数位数)

在做金额输入的时候，就需要限制小数位数，以及最大数最小数。 在网上找了很久，找到一个插件，但是忘记保存那篇博客了。。。

不过在实际使用过程中我发现在按键弹起后并且输入的值超过限制大小，那个插件只会修改输入框的值，并没有修改到v-model绑定的值，于是只好自己修改了一下，使插件修改value时能够同步修改到v-model中的值。

并且能在原生input中使用和在element-ui中的el-input中使用（如果其他的input组件也是使用的v-model绑定的value话，也可以使用此插件）

废话不多说，上代码，直接看注释就能懂

wait~还差一个目录结构，因为有两个文件

only_number
├─ index.js
└─ onlyNumber.js
复制代码

先上index.js的代码

import onlyNumber from './onlyNumber'
const install = Vue => {
  Vue.directive('only-number', onlyNumber)
}
/*
  Vue.use( plugin )
  安装 Vue.js 插件。如果插件是一个对象，必须提供 install 方法。
  如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。
  该方法需要在调用 new Vue() 之前被调用。
  当 install 方法被同一个插件多次调用，插件将只会被安装一次。
  --------------------------------------------------------
  调用示例
  最大两位小数
  <el-input
    v-only-number="{ min: 0, max: 100, precision: 2 }"
    v-model.number="price"
  />
  只允许输入整数
  <input
    v-only-number="{ min: -10, max: 100, precision: 0 }"
    v-model.number="price"
  />
*/

if (window.Vue) {
  window['onlyNumber'<