vue-local-currency v1.0.3

vue-local-currency

Localized currency conversion for Vue 3

Installation

npm install vue-local-currency

Usage

global use

import { createApp } from 'vue'
import App from './App.vue'
import { createLocalCurrency } from 'vue-local-currency'

const app = createApp(App)
const currency = createLocalCurrency()
app.use(currency)
app.mount('#app')

global support typescript

src/components.d.ts

import { LocalCurrency } from 'vue-local-currency'

declare module "vue" {
  export interface ComponentCustomProperties {
    $currency: LocalCurrency
  }
}

Examples

Composition API

<template>
  <div>
    price: <span>{{ uts('13.2') }}</span>
  </div>
</template>

<script setup>
import { useLocalCurrency } from 'vue-local-currency'

const { uts, stu, tUts } = useLocalCurrency()
</script>

template use

<template>
  <div>
    price: <span>{{ $currency.uts('13.2') }}</span>
  </div>
</template>

set local currency

<template>
  <div>
    price: <span>{{ $currency.uts(123) }}</span>
  </div>
   <button @click="changeCurrency">set currency</button>
</template>
<script setup>
import { useLocalCurrency } from 'vue-local-currency'

const { setLocalCurrency } = useLocalCurrency()

const changeCurrency = () => {
  const currency = {
    isoCode: "HKD", // currency code
    locales: "zh-CN", // Localized style configuration
    utsExchangeRate: 6.89, // USD to HKD exchange rate
    stuExchangeRate: 0.14513788098693758 // HKD to USD exchange rate
  }
  setLocalCurrency(currency)
}
</script>

setLocalCurrency arguments

locales

Localized style configuration， Language splicing country code

plugin

import { createApp } from 'vue'
import App from './App.vue'
import { createLocalCurrency } from 'vue-local-currency'

const app = createApp(App)
const lang = 'zh'
const currency = createLocalCurrency({
  setCurrency: [(currency) => {
    if (lang === 'zh') {
      currency.locales = 'zh-CN'
    }
    retunn currency
  }],
  format:  [(res) => {
    retunn res
  }]
})
app.use(currency)
app.mount('#app')

type: ComputeTypeEnum

// ts
$currency.uts('13.2', type: ComputeTypeEnum)