JSFiddle - React, Tailwind, and code Playground

by magikMaker

HTML

<input id="in">
<br><br>
<textarea id="out" rows="10" cols="30"></textarea>

JavaScript

function twoWayBinding(obj, property, element){
    
    Object.defineProperty(obj, property, {
        get: function(){
            return element.value;
        },
        set: function(value){
            element.value = value;
        },
        configurable: true
    });
    
    element.addEventListener('keyup', function(){
        obj[property] = element.value;
    });
}

var user = {},
    input = document.getElementById('in'),
    textarea = document.getElementById('out');

twoWayBinding(user, 'name', input);
twoWayBinding(user, 'name', out);