JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
<div>
Date: <input data-bind='moment: currDate' type='text' />
</div>
<div><pre data-bind='text: currDate' /></div>
JavaScript
ko.bindingHandlers.moment = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, viewModel);
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
var val = valueAccessor();
var formatted = null;
var date = moment(ko.utils.unwrapObservable(val));
var format = allBindingsAccessor().format || 'MM/DD/YYYY';
if (date && date.isValid()) {
formatted = date.format(format);
}
valueAccessor()(formatted);
ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor, viewModel);
}
};
ko.applyBindings(vm);