reflux web 中action

这前的flux结构是不错的，但是写的模块太多了。

所以有了reflux

它由action store component 组成

定义action动作，store扩展每个动作的方法，如get获取delete update等。

组件监听store的变化，并修改组件状态数据。store方法内触发监听trigger并传递最新值。

用户操作触发动作，执行store扩展 方法变动 了触发监听传递值，组件修改值。实现view更新。

/*
			ccreateAction 创建一个动作函数，
			在store内监听动作函数并调用某方法
			当使用动作函数时会调用store上的监听方法
			*/
			var addItem=Reflux.createAction();
			var addStore=Reflux.createStore({
				init:function(){
					this.listenTo(addItem,'onAddItem');
				},
				onAddItem:function(model){
					console.log(model);
				}
			});
			addItem({name:'cc'})

用createAction创建一个动作。

用createStore创建一个仓库，初始化方法内监听动作，绑定方法。

当调用动作时store内监听的方法会获取到值。

/*
			可以一次创建多个动作，返回一个对象方法名是指定的动作名
			在store内监听每个对象方法。
			调用动作对象方法，并会触发监听方法
			当有很多个动作时一个个监听很麻烦的，这时可以用listenables属性，来设置动作对象可设置多个.
			这时监听每个动作的方法名需要on+动作名首字母大写 ,reflux会一一匹配
			*/
			//init里用this.listenToMany(TodoActions);也可实现多个监听
			var todoAction1=Reflux.createActions([
				'addItem','deleteItem'
			]);
			var todoStore1=Reflux.createStore({
				listenables:[todoAction1],
				/*init:function(){
					this.listenTo(todoAction1.addItem,'onAddItem');
					this.listenTo(todoAction1.deleteItem,'onDeleteItem');
					//以下方法也可实现多个监听不用一个个写
					this.listenToMany(TodoActions);
				},*/
				onAddItem:function(model){
					console.log('onAddItem',model)
				},
				onDeleteItem:function(model){
					console.log('onDeleteItem',model)
				}
			});
			todoAction1.addItem({name:'bb'});
			todoAction1.deleteItem({name:'cc'});

可以通过createActions一次创建多个动作。

多个监听也可用listenTo 一个个来监听。

或用listenToMany(动作)  来监听，这种方式的方法名是on+动作名的首字母大写来定义方法名

或用listenables:[Xx]来监听 。

三个都可以。

/*
			每个动作都有两个hook 方法（勾子方法）
			preEmit方法会接到动作调用时传递的参数，这个方法可以处理参数，并将结果return 给shouldEmit
			不返回参数就是传递的参数。preEmit决定shouldEmit接收的参数
			
			shouldEmit参数preEmit return 的参数或默认参数。
			此方法如果return 0 或不返回表示不会触发store上监听方法。
			如果return 参数或1 或true 表示会触发store上监听方法。并传递参数
			shouldEmit决定监听是否执行。

			*/
			var addItem2=Reflux.createAction({
				preEmit:function(params){
					console.log('preEmit',params);
					//return  {name:'update'}
				},
				shouldEmit:function(params){
					console.log('shouldEmit',params);
					return 1;
				}
			})
			var todoStore3=Reflux.createStore({
				init:function(){
					this.listenTo(addItem2,this.onAddItem)
				},onAddItem:function(model){
					console.log('onAddItem',model)
				}
			})
			addItem2({name:'bbd'})

preEmit决定shouldEmit接收的值

shouldEmit 决定是否执行扩展的方法。和传递的值。

/*
			给所有的action添加公用方法，
			表示创建的action 函数 都可以action.XX来调用
			或创建的action对象都可以用obj.actionname.XX来调用
			*/
			Reflux.ActionMethods.print=function(str){
				console.log(str);
			}
			var addItem3=Reflux.createAction();

			var todoAction2=Reflux.createActions([
				'addItem','deleteItem'
			])	
			addItem3.print('cc')
			todoAction2.addItem.print('bb')

给所有动作对象添加方法

//直接调用addItem()实际上是调用trigger或者triggerAsync或者triggerPromise，它们区别在于			
			var ac1=Reflux.createAction();
			//默认调用triggerAsync 相当于ac1.triggerAsync();
			ac1();
			var ac2=Reflux.createAction({sync:true});
			//调用trigger() 相当于ac2.trigger();
			ac2();
			var ac3=Reflux.createAction({ayncResult:true});
			//调用triggerPromise()
			ac3();

			//trigger 和triggerAsync区别:
			//trigger调用时会立即调用，
			//async会在下一次循环队列时调用。
			/*
			triggerAsync=setItmeout(function(){
				trigger()
			},0)
			*/

			//trigger 和triggerPromise 区别在于后者返回的是promise

trigger、triggerAsync和triggerPromise 的区别