Statistic 統計數值

突出展示單個統計數值。支援千分位、小數精度、前後綴，字串 value 可承載超大數。

統計數值

<template>
  <div class="demo-col">
    <div class="demo-row" style="gap: 48px; flex-wrap: wrap">
      <LhStatistic title="館藏畫作" :value="1280" :separator="separator" suffix=" 幅" />
      <LhStatistic title="今日訪客" :value="visitors" />
      <LhStatistic title="均價（萬）" :value="price" :precision="2" prefix="¥" />
      <LhStatistic title="超大數" value="9007199254740993" />
    </div>
    <p class="demo-note">separator 傳空字串可關閉千分位分組</p>
    <div class="demo-row" style="gap: 48px; flex-wrap: wrap; margin-top: 16px">
      <LhStatistic title="無千分位" :value="visitors" separator="" />
      <LhStatistic :value="2026" suffix=" 年" />
    </div>
  </div>
</template>

<script>
export default {
  data: () => ({
    separator: ',',
    visitors: 38651,
    price: 182.5,
  }),
}
</script>

Props

屬性	說明	類型	預設值
title	數值標題（展示在數值上方）	string	—
value	統計數值；字串形式可承載超大數或帶符號文字	number \| string	—
precision	小數精度	number	—
separator	千位分隔符；空字串關閉分組	string	—
prefix	數值前綴，如貨幣符號	string	—
suffix	數值後綴，如單位	string	—
sx	sx 快速佈局屬性	—	—