React-Flux: Error with AppDispatcher.register

Question

I am trying to set up the most basic app in Flux-React. Its sole goal to is fire an Action, which gets sent through the Dispatcher to a Store that has registered with the Dispatcher. The store the logs the payload to Console.

Everything besides the Store is working well, but as soon as it hits AppDispatcher.register, Flux throws the following error:

Uncaught TypeError: Cannot set property 'ID_1' of undefined

Here is the code of the file causing the error, but I've put up the entire project at https://github.com/bengrunfeld/react-flux-dispatcher-error, and you can find the offending file in src/js/stores/AppStores.js

var AppDispatcher = require('../dispatcher/AppDispatcher');
var EventEmitter = require('events').EventEmitter;
var AppConstants = require('../constants/AppConstants');
var assign = require('object-assign');


var CHANGE_EVENT = 'change';

var AppStore = assign({}, EventEmitter.prototype, {
  emitChange: function() {
    this.emit(CHANGE_EVENT);
  }
});

AppDispatcher.register(function(payload){
  console.log(payload);
  return true;
})

module.exports = AppStore;

Answer 1

Because of the drought of documentation of biblical proportions for Facebook Flux, I didn't know that I was using code from previous versions.

In AppDispatcher.js, you need to define AppDispatcher in the following way using the new keyword:

var Dispatcher = require('flux').Dispatcher;
var assign = require('object-assign');

var AppDispatcher = assign(new Dispatcher(), {
  handleViewAction: function(action) {
    this.dispatch({
      source: 'VIEW_ACTION',
      action: action
    });
  }
});

module.exports = AppDispatcher;

Here is a link to a repository with the working code: https://github.com/bengrunfeld/react-flux-simple-app