Decimal Formatting in Vue Framework
I think you can use {{ parseFloat.($variable).toFixed(2) }}, is simple for decimal numbers for vue.js . you can try this.
You don't need a focus-out/focus-in method. What you need is a computed property.Try this out:
Vue.component('my-currency-input', { template: ` <div> <input type="text" v-model="currencyValue" /> {{ formattedCurrencyValue }} </div>`, data: function() { return { currencyValue: 0, /* formattedCurrencyValue: "$ 0.00" */ } }, computed: { formattedCurrencyValue: function(){ if(!this.currencyValue){ return "$0.00"} return "$" + parseFloat(this.currencyValue).toFixed(2) } }});new Vue({ el: '#app'});