`

React Reflux Store获取state值 Data Flow

阅读更多
// Component
class Plans extends React.Component {
  constructor(props){
    super(props);
    this.state = {
      params: props.params
    };
  }

  render() {
    return (
      <div className="plan-list-container">
        <PlanList { ...this.state } />
      </div>
    );
  }

}

 

// PlanList Component
class PlanList extends React.Component {

  constructor(props){
    super(props);

    this.state = {
      page_loading: false
    };

    PlanActions.setParams(props.params);
  }

 

// PlanActions
var PlanActions = Reflux.createActions([
  'setParams',
  'loadPlans',
  'loadPlansSuccess'
]);

PlanActions.loadPlans.preEmit = function(){
  PlanActions.loadPlansSuccess();
};

 

// Store
var PlanStore = Reflux.createStore({
  init() {
    this.listenToMany(PlanActions);
  },

  setParams(params) {
    this.params = params;
  },

  loadPlans() {
    this.trigger({ 
      loading: true
    });
  },

  loadPlansSuccess() {
    $.ajax({
        url: this.ajaxApi,
        dataType: 'json',
        data: {
          sku: this.params.sku
        },
        cache: true,
        success: function(data) {

 



有疑问或技术交流,扫描公众号一起讨论学习。

更多React在线学习访问:http://each.sinaapp.com/react/index.html

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics