JSFiddle - React, Tailwind, and code Playground

by koehr

HTML

<h1>
Look into your Javascript console!
</h1>

JavaScript

function reactive (obj) {
  const wrapped = {}

  for (let key in obj) {
    let value = obj[key]

    wrapped.__defineGetter__(key, function reactiveGetter () {
      return value
    })

    wrapped.__defineSetter__(key, function reactiveGetter (newValue) {
      console.log('setting value from', value, 'to', newValue)
      value = newValue
    })
  }

  return wrapped
}

const reactiveData = reactive({
  foo: 1
})

reactiveData.foo++
console.log(reactiveData.foo)