价格 Price

售卖商品的价格。

价格及价格符号

通过value属性设定价格。

通过unit属性设置价格单位。默认值为￥。

通过mode属性设置价格类型，可选值为number、text，默认值为number。

示例代码

  <l-price unit="￥" value="666"></l-price>
  <l-price unit="$" value="666"></l-price>
  <l-price unit="￥" value="666~777" mode="text"></l-price>

是否为删除态价格

通过deleted属性设置价格是否为删除态。默认值为false。

通过del-color属性设置价格删除态的颜色。

示例代码

  <l-price 
    unit="￥"
    value="666"
    deleted="{{true}}"
    del-color="#3963bc"
  ></l-price>

价格小数保留位数及自动补零

通过reserve-digit属性设置价格小数保留的位数。默认保留2位小数。

通过autofix属性设置自动补零。例如设置value为666.00，默认显示为666，开启自动补零可正常显示。

示例代码

  <l-price 
    unit="￥"
    value="666.00"
    autofix
    reserve-digit="2"
    unit-color="#3963bc"
    unit-size="28"
  ></l-price>

价格颜色及大小

通过color、size、bold属性设置价格整体的颜色、大小及字体粗细。

通过unit-size属性设置价格单位的大小。

通过unit-color属性设置价格单位的颜色。

通过value-size属性设置价格的大小。

通过value-color属性设置价格的颜色。

TIP

color、size、bold可以被unit-size等属性覆盖。

示例代码

  <l-price 
    unit="￥"
    value="666"
    unit-color="#3963bc"
    unit-size="28"
  ></l-price>

价格属性（Price Attributes）

价格外部样式类 (Price ExternalClasses)