# 6、discount 折扣输入

存储行为:数据库中以 小数 形式存储(显示 7 折 = 存储 0.7),存储时会额外保留 1 位精度以避免浮点误差。显示范围 0~10 折。

注意min 属性在此模式下不生效。

# 万能表单使用方式

# 基础用法

{ key: "discount", title: "折扣类型", type: "discount" },
1

# 范围输入(输入多个值)

vk-unicloud-admin-ui 的 npm 依赖版本需 >= 1.24.1

// 输入2个值
{ key: "discount", title: "折扣范围", type: "discount", range: true, placeholder: ["最低折扣", "最高折扣"] },

// 输入3个值
{ key: "discount", title: "折扣范围", type: "discount", range: 3, placeholder: ["折扣1", "折扣2", "折扣3"] },
1
2
3
4
5

# API

# 公共属性

点击查看『公共属性』 (opens new window)

# 组件属性

参数 说明 类型 默认值 可选值
placeholder 占位符(字符串=所有格共用;数组=每格独立) String、Array - -
precision 精度(显示值的小数位数) Number 2 -
max 最大值(基于显示值) Number 10 -
rightText 右侧文字后缀 String -
width 宽度 String、Number - -
disabled 是否禁用 Boolean false true
clearable 是否可以清空 Boolean true false
readonly 是否只读 Boolean false true
allowNegative [1.24.1 新增] 是否允许输入负数 Boolean false true
showRightText [1.24.1 新增] 是否显示右侧后缀 Boolean true false
emptyValue [1.24.1 新增] 空值时实际发出的值 String、Number null -
range [1.24.1 新增] 范围输入模式 Boolean、Number false true / 数字 N(≥2)
rangeSeparator [1.24.1 新增] 范围输入的分隔符 String - -

# 万能表格使用方式

{ key: "discount", title: "折扣类型", type: "discount", width: 100 },
1

# template 使用方式

# 基础用法

vk-unicloud-admin-ui 的 npm 依赖版本需 >= 1.24.1

<vk-data-input-numeric mode="discount" v-model="form1.value1" placeholder="请输入折扣" :precision="2" width="300px"></vk-data-input-numeric>
1

# 范围输入

vk-unicloud-admin-ui 的 npm 依赖版本需 >= 1.24.1

<vk-data-input-numeric mode="discount" v-model="form1.discountRange" :range="true" placeholder="['最低折扣', '最高折扣']" width="400px"></vk-data-input-numeric>
1

# 旧组件说明

旧组件 vk-data-input-discount 仍然可用,但推荐使用统一组件 vk-data-input-numeric(mode="discount")替代。

<!-- 旧写法(仍可用) -->
<vk-data-input-discount v-model="form1.value1" placeholder="请输入折扣" :precision="2" width="300px"></vk-data-input-discount>
1
2