react-lensed-state
Adds react opportunity to work with the state in a hierarchical notation, for example this.linkState ('model.user.name') will point to the part of the object state. Work of lens are immutable, that is, after changing the value will create a new state object.
Example
var LensedExample = React . createClass ( {
mixins : [ LensedStateMixin ] ,
getInitialState : {
model : {
user : {
name : " John " ,
email : " john@example.com "
} ,
notify : {
email : true ,
fb : false
}
}
} ,
render : function ( ) {
return (
< form >
< input valueLink = { this . linkState ( ' model.user.name ' ) } type = " text " name = " user-name " / >
< input valueLink = { this . linkState ( ' model.user.email ' ) } type = " text " name = " user-email " / >
< input valueLink = { this . linkState ( ' model.notify.email ' ) } type = " checkbox " name = " notify-email " / >
< input valueLink = { this . linkState ( ' model.notify.fb ' ) } type = " checkbox " name = " notify-fb " / >
< / form >
) ;
}
} ) ;
Installing
The easiest way is to grab it from NPM. If you're running in a Browser
environment, you can use [Browserify][]
$ npm install react-lensed-state