Skip to content
On this page

ZvMoney

ZvMoney is a standalone component to only render and display a formatted price according with the locale and the currency provided

INFO

Before you have to import the global css files in your project, follow instructions in Getting Started

Basic usage

1 240 EURUSD 1,240GBP 1,2401 240 €$1,240£1,240

By default, when you use the japan locale with the JPY currency, the price is rounded and displayed with the currency symbol

¥1,241JPY 1,241
vue
<template>
  <ZvMoney :price="1240" locale="fr-FR" currency="EUR" />
  <ZvMoney :price="1240" locale="en-US" currency="USD" />
  <ZvMoney :price="1240" locale="en-GB" currency="GBP" />

  <ZvMoney :price="1240" locale="fr-FR" currency="EUR" :options="{ currencyDisplay: 'symbol' }" />
  <ZvMoney :price="1240" locale="en-US" currency="USD" :options="{ currencyDisplay: 'symbol' }" />
  <ZvMoney :price="1240" locale="en-GB" currency="GBP" :options="{ currencyDisplay: 'symbol' }" />

  <p>
    By default, when you use the japan locale with the JPY currency, the price is rounded and displayed with the currency symbol
  </p>
  <ZvMoney :price="1240.50" locale="ja-JP" currency="JPY" />
  <ZvMoney :price="1240.50" locale="ja-JP" currency="JPY" :options="{ currencyDisplay: 'code' }" />
</template>

<script lang="ts" setup>
  import ZvMoney from '@zadigetvoltaire/ui/components/ZvMoney'
</script>