2016-03-17 20 views
1

我最近开始使用alt.js改写应用程序&,该应用程序允许使用数据从服务器呈现时轻松引导应用程序。在调度时不触发alt存储方法的替代操作(Flux)

除了事实上,其他所有工作都很好,除非我的存储方法在客户端发送操作时无法启动。

动作updateCurrentPostType正在我的一个响应组件中从onClick事件中调用。运行一些测试后,我可以确认我的Action和回调函数正在被解雇,但商店似乎没有选择任何东西。

我试过在我的商店构造函数中使用bindListeners &但仍然没有结果。

我知道这不是一个真正的问题,但我希望有更多经验的人使用ALT可以看到我是否缺少任何重要的东西。

“ALT”: “^ 0.14.5”

这里是我的代码。谢谢你的时间。

PostTypeLink.jsx(阵营成分,称为在loadPostType方法动作)

"use strict"; 

var React = require('react'); 
var Router = require('react-router'); 
var PostTypeActions = require('../../../actions/postTypeActions'); 

var PostTypeLink = React.createClass({ 

    contextTypes: { 
     router: React.PropTypes.func 
    }, 

    getInitialState: function() { 
     return this.props.postType; 
    }, 

    loadPostType: function(e) { 
     e.preventDefault(); 

     var self = this; 
     var postTypeName = this.props.postType.info.posttype_name; 

     PostTypeActions.updateCurrentPostType(postTypeName, function() { 

      self.context.router.transitionTo('/admin/content/'+postTypeName); 
     }); 
    }, 

    render: function() { 
     var postTypeName = this.props.postType.info.posttype_name; 

     return (
      <li key={this.props.key}> 
       <a href="#" onClick={this.loadPostType}> 
        <i className="fa fa-book fa-fw"></i> {_.startCase(postTypeName)} 
       </a> 
      </li> 
     ); 
    } 
}); 

module.exports = PostTypeLink; 

PostTypeActions.js

"use strict"; 

var alt = require('../alt'); 
var request = require('superagent'); 

class PostTypeActions { 

    loadAllPostTypes(cb) { 
     var self = this; 

     request 
     .get('/api/v1/posttypes') 
     .end(function(err, res) { 
      if (err) { 
       console.log('Request Failed: '+err); 
      } else { 
       var response = JSON.parse(res.text); 

       self.actions.updatePostTypes(response); 

       if (cb) { 
        cb(); 
       } 
      } 
     }); 
    } 

    updatePostTypes(postTypes){ 
     this.dispatch(postTypes); 
    } 

    updateCurrentPostType(postTypeName, cb){ 
     console.log('updating current post type'); 
     this.dispatch(postTypeName); 

     if (cb) { 
      cb(); 
     } 
    } 
} 

module.exports = alt.createActions(PostTypeActions); 

PostTypeStore.js

"use strict"; 

var alt = require('../alt'); 
var PostTypeActions = require('../actions/PostTypeActions'); 

class PostTypeStore { 

    constructor() { 
     var self = this; 

     this.bindListeners({ 
      updatePostTypes: PostTypeActions.updatePostTypes, 
      updateCurrentPostType: PostTypeActions.updateCurrentPostType 
     }); 

     this.on('init', function() { 
      self.postTypes = []; 
      self.currentPostType = null; 
     }); 
    } 

    updatePostTypes(postTypes) { 
     this.postTypes = postTypes; 
     this.emitChange(); 
    } 

    updateCurrentPostType(postTypeName) { 
     var self = this, 
      _postTypes = this.postTypes; 

     for (var i = 0; i < _postTypes.length; i++) { 
      if (_postTypes[i].info.posttype_name == postTypeName) { 
       console.log(_postTypes[i]); 
       self.currentPostType = _postTypes[i]; 
       self.emitChange(); 
      } 
     } 
     console.log('THIS METHOD WONT FIRE!!!!'); 
     console.log(self.currentPostType); 
    } 
} 

module.exports = alt.createStore(PostTypeStore, 'PostTypeStore'); 

回答

0

您必须实际需要将某个存储位置编译到代码中并让它开始监听这些操作。仅仅创建一个商店是不够的。简单的要求上面的PostTypeLink.jsx应该就够了。

+0

谢谢你回答这个问题。当我有机会时会更新我的代码,并让它知道它是否有效。 – MunkyMead

相关问题