Skip to content

a small JS library for reactive object-to-object data binding with JS setters

License

Notifications You must be signed in to change notification settings

Izzi97/js-data-binding

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Reactive One-way Data Binding using JS Setters

Instantiate a data binding model with optional name and and set up a subscriber.

import { Model } from './data-bind.js'
const model = new Model('my-model')

const subscriber = {
  value: 'nothing'
}

Define a property on the model and establish a one-way data binding to a property of the subscriber.

model.bind('someProperty', subscriber, 'value')

Each new assignment of the model's property is reflected to all its subscribers.

model.someProperty = 'hello' // subscriber.value === 'hello'
model.someProperty = 'world' // subscriber.value === 'world'
model.someProperty = '!'     // subscriber.value === '!'

The model also keeps track of all assigned values in a history.

console.log(model.history.someProperty)

Output:

['hello', 'world', '!']

For a working example with ui integration take a look at index.html.

About

a small JS library for reactive object-to-object data binding with JS setters

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published