vcheck-directive

Vue 3 输入校验指令，支持整数、浮点数、负数和小数精度控制

特性

• 支持整数和浮点数输入限制
• 可控制小数位精度
• 可允许或禁止负数
• 可设置最小值和最大值
• 自动处理粘贴、输入法组合输入
• 简单易用的 Vue 3 指令插件

安装

npm install vcheck-directive
# or
yarn add vcheck-directive

使用

全局注册

import { createApp } from 'vue'
import App from './App.vue'
import VCheck from 'vcheck-directive'

const app = createApp(App)
app.use(VCheck) // 默认指令名为 v-check
app.mount('#app')

在模版中使用

<template>
  <div>
    <!-- 浮点数，保留两位小数，允许负数，限制 0~100 -->
    <input v-check.float="{ precision: 2, allowNegative: true, min: 0, max: 100 }" />

    <!-- 整数，不允许负数 -->
    <input v-check.int="{ allowNegative: false }" />
  </div>
</template>

指令参数

类型（type） • int：整数 • float：浮点数（默认）

可选配置 • precision：小数位精度（默认 2） • allowNegative：是否允许负数（默认 false） • min：最小值（默认 -Infinity） • max：最大值（默认 Infinity）

参数详细说明

| 参数 | 类型 | 默认值 | 说明 | |------|------|--------|------| | precision | number | - | 浮点数的小数位精度 | | allowNegative | boolean | false | 是否允许负数 | | min | number | - | 最小值 | | max | number | - | 最大值 |

指令修饰符

• v-check.int：等同于 type: 'int'
• v-check.float：等同于 type: 'float'