Step Input
<script lang="ts" setup>import { NNStepInput } from "@fronntui/vue";</script>
<template> <NNStepInput v-model="model" :min="5" :max="40" :step="2" /> <NNStepInput v-model="model" disabled /> <NNStepInput :step="2" error /></template>Props
Name
Type
modelValue number | string model value
min number | string minimum value. Defaults to 0.
max number | string maximum value. Defaults to Infinity
step number | string Step size. Defaults to 1.
disabled boolean Whether or not the control is disabled
error boolean Whether or not the control is in error state
precision number precision used for parsing numbers (number of digitals after the deciaml separator). Defaults to 2.
parseValue (value: string) => number Custom input parsing function. The default implementation uses a dot (.) as
decimal separator and replaces commas with dots. The valu is passed to the
Number constructor afterwards.
Events
Name
Payload
update:modelValue number fixed { input: string, final: number } Fired after the input has been fixed. This may happen if the parsed value exceeds the allowed range (min, max) or doesn’t respect the step size.