uci-utils-rx-class/examples/example.js

import RxClass from '../src/rx-class.js'

class Example extends RxClass  {
  constructor(opts={}){
    super(opts)
    this.test = 10
    this.another = { bar:'bust', foo:3}
  }
}

const example = new Example({
  _rx_ : {
    handler: value => {console.log('-----------default subscription handler-------', value)}
  }
})

console.log('instance before doing rx on properties\n')
console.log(example)
console.log('--------------------------')

example.on('changed', (prop) => console.log('emitted----a property changed-----',prop))
example.on('test', (val) => console.log('emitted value of test',val))

console.log('making \'test\' reactive')
example.rxAdd('test')
console.log('changing test to 20, 30 directly')
example.test = 20
example.test = 30
example.rxSubscribe('test',(prop)=>console.log('#############late subscription to \'test\' after 30 ############',prop),'custom')
console.log('changing test to 40 via set')
example.set('test',40)

console.log('making a deeper property \'another.foo\' reactive')
example.rxAdd('another.foo')

example.another.foo = 7

console.log('direct access of another.foo',example.another.foo)
console.log('access via get of another.foo',example.get('another.foo'))

console.log('making a deeper property \'some.thing\' reactive that did not exist')
example.rxAdd('some.thing')

// console.log('some test',example.some.test)

example.some.thing=15
console.log('--------------------------')
console.log('instance after adding rx to properties\n')
console.log(example)
console.log('--------------------------')

console.log('now removing reactivity from  \'test\'')
example.rxRemove('test')
example.set('test',42)
console.log('\'test\' now holds unreactive value')
console.log('now removing reactivity from  \'test\' again')
example.rxRemove('test')
console.log('--------------------------')
console.log('instance after removing rx from \'test\'\n')
console.log(example)
console.log('--------------------------')

// console.log('some test',example.some.test)