JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js"></script>
<div>
    <my-component params="name: name"></my-component>
    <button data-bind="click: updateName">Update</button>
</div>
<input data-bind="value: name" />

JavaScript

var componentVm = function (params) {
    this.name = params.name;
}

ko.components.register('my-component', {
    viewModel: componentVm,
    template: 'Name: <input data-bind="value: name" /> '
});

var vm = {
    name: ko.observable("John Smith"),
    updateName: function() {
         this.name("Smith John");   
    }
};
ko.applyBindings(vm);