ak-counter 计数器

示例（彩色）

227107

5945

59

<template>
  <div class="ak-counter-group">
    <div class="ak-counter">
      <div class="ak-counter__prefix">
        <svg class="ak-icon" aria-hidden="true" style="color: #22bbff;">
          <use xlink:href="#icon-money-cny-box-fill"></use>
        </svg>
      </div>
      <div class="ak-counter__content">227107</div>
    </div>

    <div class="ak-counter">
      <div class="ak-counter__prefix">
        <svg class="ak-icon" aria-hidden="true" style="color: crimson;">
          <use xlink:href="#icon-sword-line"></use>
        </svg>
      </div>
      <div class="ak-counter__content">5945</div>
      <div class="ak-counter__suffix">
        <svg class="ak-icon" aria-hidden="true">
          <use xlink:href="#icon-add-circle-fill"></use>
        </svg>
      </div>
    </div>

    <div class="ak-counter">
      <div class="ak-counter__prefix">
        <svg
          class="ak-icon"
          aria-hidden="true"
          style="color: var(--ak-color-advanced)"
        >
          <use xlink:href="#icon-settings-line"></use>
        </svg>
      </div>
      <div class="ak-counter__content">59</div>
      <div class="ak-counter__suffix">
        <svg class="ak-icon" aria-hidden="true">
          <use xlink:href="#icon-add-circle-fill"></use>
        </svg>
      </div>
    </div>
  </div>
</template>