回流如何监听异步动作完成

Question

从阅读文档我不太了解Reflux异步操作如何工作.特别是我需要在异步操作完成时触发某些操作.

在我的一个组件中,我想要监听异步操作完成,然后转换到视图.

mixins: [State, Navigation, Reflux.listenerMixin],

componentDidMount() {
  this.listenTo(actions.loadProject.completed, ()=>{this.transitionTo('info')});
},

我创建了这样的动作:

var actions = Reflux.createActions([
  "someSyncAction",
  "anotherSyncAction"
]);

actions.loadProject = Reflux.createAction({
  "loadProject": {children: ['completed','failed']},
});

在我的projectStore中我有这样的东西:

 onLoadProject(id) {

    var url = '/api/projects/' + id;
    io.socket.get(url, (body, jwr) => {

      if(jwr.statusCode !== 200){
        console.error('Failed to load project', id, body);
        return actions.loadProject.failed();
      }

      var p = body;
      debug('loaded project', id, p);
      this.project = p;
      this.trigger(p);
      actions.loadProject.completed();
    });
  },

但是看起来actions.loadProject.completed不是一个函数,所以上面的代码不起作用.什么是正确的方法？

Answer 1

我发现我的原始代码因为一个错字和一个错误而无效.以下是更正.

mixins: [State, Navigation, Reflux.listenerMixin],

本来应该

mixins: [State, Navigation, Reflux.ListenerMixin],

我相信未定义的mixins的警告已添加到React中,但显然还没有进入我的版本.

actions.loadProject = Reflux.createAction({
 "loadProject": {children: ['completed','failed']},
});

本来应该

actions.loadProject = Reflux.createAction({children: ['completed','failed']});

我曾使用过createAction 的语法.这就是loadProject.completed不是函数的原因.反射创造了一个简单的行动,没有显然抱怨.

在Tim Arney的示例中,您可以将API调用保留在单独的动作侦听器中,并使存储仅侦听已完成的操作.我想我更喜欢使用商店逻辑保持API调用.如果有人认为我有充分的理由不喜欢听到它.