Handy unit conversion filters for your Vue.js project
npm install vue-units
npm install vue-units --save
`
If you prefer to use Yarn, you can install it with the following command instead:
`
yarn add vue-units
`
Add it to your vue instance:
`javascript
import Vue from 'vue';
import VueUnits from 'vue-units';
Vue.use(VueUnits)
`
If you don't use ES6, you can also include it as a script locally:
`html
`
Usage
$3
#### unit()
The filter unit(from, to, includeUnit) is added to your Vue instance, which makes it easy to convert between a set of units in your templates:
`vue
{{1500 | unit('m', 'km', true)}}
`
The above code will result in the following output:
`
1.5 km
`
If includeUnit is false, only the converted value will be returned:
`
1.5
`
To see a list of available conversion units, please refer to the official repository for convert-units.
$3
You can access the instance of convert-units anywhere in your Vue templates, which gives you access to the additional functions that the convert-units package provides:
`javascript
this.$units(12000).from('mm').to('m');
// 12 Metres
this.$units(12000).from('mm').toBest();
// 12 Meters (the smallest unit with a value above 1)
this.$units(12000).from('mm').toBest({ exclude: ['m'] })
// 1200 Centimeters (the smallest unit excluding meters)
this.$units(12000).from('mm').toBest({ cutOffNumber: 10 });
// 900 Centimeters (the smallest unit with a value equal to or above 10)
this.$units(12000)from('mm').toBest({ cutOffNumber: 10 })
// 10 Meters (the smallest unit with a value equal to or above 10)
this.$units(12000).from('m').possibilities();
// ["mm", "cm", "m", "km", "in", "yd", "ft-us", "ft", "mi"]
this.$units().measures();
// [ 'length', 'mass', 'volume' ]
`
For additional methods, please refer to the official repository for convert-units.
#### Example:
`html
``