Stepper 步进器
用于输入或调整数值的组件，支持自定义步长、精度、格式化以及不同的布局。
组件特性
- 🔢 数值控制：支持自定义最小值、最大值、步长和精度。
- 🎨 布局多样：支持控制按钮在两侧、在右侧，或者仅显示按钮。
- 🔤 格式化：支持自定义数值格式化和解析（例如货币格式）。
- 📏 多尺寸：提供小、中、大三种尺寸。
- 🖱️ 长按支持：支持长按按钮连续增减数值。
- 📋 表单集成：与
BrForm无缝集成，支持验证状态显示。
基础用法
最基础的步进器，通过 v-model 绑定数值。
Current Value: 1
Example
精度与步长
通过 step 属性设置步长，precision 属性设置小数精度。
Current Value: 0.5
Example
格式化
通过 formatter 和 parser 属性可以自定义输入框中数值的显示格式。
Example
按钮位置与模式
通过 controls-position 可以改变按钮的位置，通过 button-only 可以隐藏输入框仅保留控制按钮。
5
Example
尺寸
支持 sm、md、lg 三种不同尺寸。
xs (Extra Small Size)
sm (Small Size)
md (Medium Size，Default)
lg (Large Size)
xl (Extra Large Size)
2xl (Massive Size)
Example
与表单集成
在表单中的典型应用，支持与 BrFormItem 配合展示验证状态和禁用状态。
Example
主题定制
结合 BrConfigProvider，可以全局覆盖组件默认样式。同时可以通过 TailwindCSS 局部覆盖样式。
Example
API 说明
BrStepper
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| modelValue / v-model | number | null | - | 绑定值 |
| defaultValue | number | null | - | 默认值（非受控模式） |
| min | number | Number.MIN_SAFE_INTEGER | 最小值 |
| max | number | Number.MAX_SAFE_INTEGER | 最大值 |
| step | number | 1 | 每次改变的步数 |
| precision | number | - | 数值精度 |
| disabled | boolean | false | 是否禁用 |
| readonly | boolean | false | 是否只读 |
| size | 'sm' | 'md' | 'lg' | 'md' | 步进器尺寸 |
| formatter | (value: number | null) => string | - | 指定输入框展示值的格式 |
| parser | (value: string) => number | null | - | 指定从输入框提取数字的方式 |
| debounceDelay | number | 300 | 输入框变更防抖延迟(ms) |
| longPress | boolean | true | 是否启用长按连续改变数值 |
| buttonOnly | boolean | false | 是否仅显示按钮（不显示输入框） |
| controlsPosition | 'both' | 'right' | 'both' | 控制按钮位置 |
| placeholder | string | - | 占位符文本 |
事件
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| update:modelValue | 绑定值发生改变时触发 | (value: number | null) |
| change | 绑定值发生改变时触发 | (value: number | null) |
| blur | 输入框失去焦点时触发 | (event: FocusEvent) |
| focus | 输入框获得焦点时触发 | (event: FocusEvent) |