JSFiddle - React, Tailwind, and code Playground
HTML
<p><input data-bind="value: firstName"></p>
<p><input data-bind="value: lastName"></p>
<p><input data-bind="value: fullName"></p>
<p> <span data-bind="text: upperFullName"> </span> </p>
JavaScript
function AppViewModel() {
var self = this;
self.firstName = ko.observable('rahul');
self.lastName = ko.observable('sharma');
self.fullName = ko.computed(function() {
return self.firstName() +' ' + self.lastName();
});
self.upperFullName = ko.computed(function() {
return self.fullName().toUpperCase();
});
}
// Activates knockout.js
ko.applyBindings(new AppViewModel());