README
v-money-format
实现一个Vue的自定义金额格式化组件和指令,组件名:money-format;指令名:v-money-format
使用方法
注意:组件使用和指令使用时,v-model绑定时都需要加 .lazy 修饰符
全局使用
import Vue from 'vue'
import moneyFormat from 'v-money-format'
// register directive v-money-format and component <money-format>
Vue.use(moneyFormat, { precision: 2 })
作为组件使用
<template>
<div>
<money-format v-model.lazy="price" v-bind:config="config"></money-format>
</div>
</template>
<script>
import { MoneyFormat } from 'v-money-format'
export default {
components: { MoneyFormat },
data () {
return {
price: 123.45,
config: {
thousands: '.',
precision: 2
}
}
}
}
</script>
作为指令使用
<template>
<div>
<input v-model.lazy="price" v-money-format="config" />
</div>
</template>
<script>
import { VMoneyFormat } from 'v-money-format'
export default {
data () {
return {
price: 123.45,
config: {
thousands: '.',
precision: 2
}
}
},
directives: { 'money-format': VMoneyFormat }
}
</script>
属性参数
property | Required | Type | Default | Description |
---|---|---|---|---|
precision | true | Number | 2 | 小数位数 |
thousands | false | String | , | 千分位分隔符 |