JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-debug.js"></script>
<label>Euros:
    <input name="wholeNumber" type="number" data-bind="textInput: wholeNumber" />
</label>---
<label>Cents: <span data-bind="text: cents"></span>

    <button data-bind="click: setCents">Randomize cents</button>

CSS

label {
    display: block;
    margin: 10px 0;
}

JavaScript

function ViewModel() {
    self = this;
    self.wholeNumber = ko.observable(1);
    self.cents = ko.pureComputed({
        read: function () {
            return Math.round(self.wholeNumber() * 100);
        },
        write: function (val) {
            self.wholeNumber((val / 100).toFixed(2));
        }
    });
    self.quantity = ko.observable();

    self.setCents = function () {
        self.cents(Math.floor(Math.random() * 1000));
    }
}

ko.applyBindings(ViewModel);