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 的区别