react-native-immutable

Installation

$ npm install react-native-immutable --save

Useage

react-native project
 |---index.ios.js
 |---App
 |---Actions
 	 |--- mainAction.js
 	 |--- userAction.js
 	 |--- articleAction.js
 	 |--- ...
 |---Stores
 	 |--- mainStore.js
 	 |--- userStore.js
 	 |--- articleStore.js
 	 |--- ...
 |---Webapi
 

index.ios.js

'use strict';
var React = require('react-native');
var { mixins } = require('react-native-immutable');
var StoreMixin = mixins.StoreMixin;
var appStore = require('./App/Stores/mainStore');
var appAction = require('./App/Actions/mainAction');
var {
 AppRegistry,
 StyleSheet,
 View,
 Text
} = React;
var App = React.createClass({
 mixins: [StoreMixin(appStore,"user","article")],
 onChangeUserName: function(){
 	appAction.emit('onChangeUserName', "wilson");
 },
 render: function() {
 
 console.log(this.state); // when store was changed, the state will change;
 
 console.log(this.state.username)
 
 return (
 	<View>
 		<Text onPress={this.onChangeUserName}>Change user name</Text>
 	</View>
 ) 
 } 
});
 
 
AppRegistry.registerComponent('DEMO', () => App);

mainAction.js

'use strict';
var {Action} = require('react-native-immutable');
// require userAction
require('./userAction')();
// require articleAction
require('./articleAction')();
module.exports = Action;

userAction.js

'use strict';
var Immutable = require('immutable');
var {Action} = require('react-native-immutable');
var appStore = require('../Stores/mainStore');
// 更新管理员
var userAction = function(){
	Action.on('onChangeUserName', function(name) {
		// study immutable.js visit http://facebook.github.io/immutable-js/
 	appStore.getStore("user").set('name', name );
	});
}
module.exports = userAction;

mainStore.js

'use strict'
var Immutable = require('immutable');
var {Store,Action} = require('react-native-immutable');
var React = require('react-native');
var appStore = module.exports = Store({
 user: require('./userStore'),
 article: require('./articleStore')
});
// Use AsyncStorage if u what
var {
 AsyncStorage
} = React;
var db_name = "app_store";
Action.on("_updateStore", function(data){
 AsyncStorage.setItem(db_name, JSON.stringify(data), function(err) {
 if (err) {
 console.error("error")
 }
 });
});
//initial Data
AsyncStorage.getItem(db_name, function(err, res) {
 if (err) {
 console.error("error")
 } else {
 if( typeof res == undefined ){
 Action.emit("_updateStore",appStore.getData());
 }else{
 appStore = Immutable.fromJS(JSON.parse(res));
 }
 }
});

userStore.js

'use strict'
module.exports = {
 name: ''
}