JSFiddle - React, Tailwind, and code Playground

by yyx990803

HTML

<script src="https://rawgit.com/yyx990803/vue/dev/dist/vue.js"></script>
<input type="text" autofocus v-model="money | currencyDisplay">
<br><br>
{{ money }}
<br><br>
<button v-on="click: money = 3.5">Set money to 3.5</button>

JavaScript

new Vue({
    
    el: 'body',
    
    data: {
        money: 294.32
    },
    
    filters: {
        currencyDisplay: {
            read: function(val) {
                return '$'+val.toFixed(2)
            },
            write: function(val, oldVal) {
                var number = +val.replace(/[^\d.]/g, '')
                return isNaN(number) ? 0 : number
            }
        }
    }

})