spz-currency 金额
展示带有货币符号的金额。
布局
跳转到“布局”何时使用
跳转到“何时使用”需要展示带有货币符号的金额。
代码演示
跳转到“代码演示”基本用法
跳转到“基本用法”最简单的用法，只需要指定金额数值。金额的符号、位置和格式默认都通过 window.SHOPLAZZA 对象获取。元素会创建一个带有 money 类的子元素来展示金额。
<spz-currency value="999998888" layout="container"></spz-currency>添加自定义类
跳转到“添加自定义类”给带有 money 类的子元素添加自定字体颜色类。
<spz-currency container-class="text-pink-500" value="999998888" layout="container"></spz-currency>自定义金额格式
跳转到“自定义金额格式”自定义货币符号和位置。
<spz-currency
value="999998888"
layout="container"
format="amount_with_comma_separator"
symbol="€"
symbol-position="left"
></spz-currency>使用货币代码，等价于上面的自定义货币符号和位置。
<spz-currency
value="999998888"
layout="container"
format="amount_with_comma_separator"
code="EUR"
></spz-currency>属性
跳转到“属性”| 属性名 | 说明 | 类型 | 默认值 | 是否必需 |
|---|---|---|---|---|
| value | 金额 | number | - | 是 |
| format | 指定金额的显示格式 | formatType | amount |
否 |
| symbol | 金额符号 | string | $ |
否 |
| symbol-position | 金额符号位置 | “left” | “right” | left |
否 |
| code | 指定一个货币代码，支持大约150种货币代码。例如：USD, EUR 等 |
string | - | 否 |
| container-class | 给带有 money 属性的子元素添加类 |
string | - | 否 |
formatType
跳转到“formatType”| 支持格式 | 例子 |
|---|---|
| amount | 999,998,888.00 |
| amount_no_decimals | 999,998,888 |
| amount_with_comma_separator | 999.998.888,00 |
| amount_no_decimals_with_comma_separator | 999.998.888 |
| amount_with_apostrophe_separator | 999’998’888.00 |