金额 Price

专为 S2B 交易场景封装的金额展示组件。自动将价格拆分为整数位与小数位实现字号阶梯对比，并通过 baseline 基线对齐保证货币符号 ¥、整数、小数与计量单位底部齐平。

尺寸梯度（small / medium / large）

内置三档视觉规格，分别对应指导价/定金、商品列表主价与购物车底部结算大总价。

Small（辅助价/定金）

已预付定金¥22.8/包

Medium（列表主价，默认）

¥185.66/件

Large（购物车结算大总价）

¥1280.5

<Price :value="22.8" label="已预付定金" size="small" unit="/包"/>
<Price :value="185.66" size="medium" unit="/件"/>
<Price :value="1280.50" size="large"/>

划线原价与右侧价格标签插槽

支持通过 del 开启删除线样式，以及通过 #extra 插槽在金额右侧直接挂载 Tag 标签。

¥185.66/件

一客一价

¥210/件

<Price :value="185.66" unit="/件">
  <template #extra>
    <Tag category="price" type="green">一客一价</Tag>
  </template>
</Price>

<Price :value="210.00" color="gray" del size="small" unit="/件"/>

API 参数说明

参数名	说明	类型	默认值
value	价格数值（自动拆分整数与小数位）	number | string	0
size	尺寸梯度：small / medium / large	string	'medium'
color	颜色主题：red（价格红）/ gray（弱化灰）/ action（强调绿）	string	'red'
unit	计量单位（如 '/包'、'/件'）	string	''
label	前缀说明文字（如 '指导价：'、'已预付定金'）	string	''
del	是否显示删除线（用于划线原价）	boolean	false
symbol	货币符号	string	'¥'
showSymbol	是否展示货币符号	boolean	true