简体   繁体   中英

With flux, how do I get the right Store called

I'm new to react/flux architecture, and I'm missing something...I think. I have two Stores, SubjectsStore.js and WorkDoneStore.js with an AppActions which does the dispatch (code snippets all below). I'm under the impression that any Store that registers with the AppDispatcher will get notice of the event, and it is incumbent on each store to handle the proper action types. There doesn't seem to be any other way of controlling which Store gets called. In my case, I've gotten as far as getting one the SubjectStores registration to be called, but my WorkDoneStore is not getting called. What am I overlooking / doing wrong.

AppActions.js

import AppDispatcher from './AppDispatcher.js';

import WorkDoneConstants from '../constants/WorkDoneConstants.js';
import SubjectConstants from '../constants/SubjectConstants.js';

var AppActions = {
  addWorkDoneItem:function(item){
    console.log("In app actions addWorkDone");
    console.log(WorkDoneConstants.WORKDONE_INSERT);
    AppDispatcher.dispatch({
      actionType:WorkDoneConstants.WORKDONE_INSERT,
      item:item
    })
  }
}
module.exports = AppActions;

SubjectsStore.js

var AppDispatcher = require('../dispatcher/AppDispatcher');
var SubjectConstants = require('../constants/SubjectConstants');
var EventEmitter = require('events').EventEmitter;
...
AppDispatcher.register(function(action) {
  var text;
  console.log("why am I in the subjectStore?");
  console.log(action.actionType);
  console.log(action.item);
  switch(action.actionType) {
    case SubjectConstants.SUBJECT_CREATE:
      text = action.text.trim();
...

WorkDoneStore.js

...
AppDispatcher.register(function(action) {
  var text;
  console.log("In WorkDoneStore");
  console.log(action);
  switch(action.actionType) {
    case WorkDoneConstants.WORKDONE_INSERT:
      item = action.item;
      if (item.subject !== '') {
        create(item);
        WorkDoneStore.emitChange();
      }
      break;
...

My component

...
  handleSubmit: function(e){
    e.preventDefault();
    var item = {
      subject:this.state.subject,
      workDone:this.state.workDone,
      minutes:this.state.totalMinutes,
      startStop:this.state.startStop,
    };
    console.log("before AppActions.");
    AppActions.addWorkDoneItem(item);

  },
...

In looking through my Webpack output I noticed that the WorkDoneStore.js wasn't getting included. By forcing it to be included via a call to it, it's now working.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM