React Flux: Components/Views

What I miss is a discussion of how to handle errors in the flux architecture. Maybe an idea for a new movie?

in app-store.js I had to make the following change:

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

to avoid React key warnings in app-catalog.js :

var Catalog =
    React.createClass({
        getInitialState: function(){
            console.log(getCatalog());
            return getCatalog();
        },
        render: function(){
            var items = this.state.items.map(function(item){
                return <tr key={item.id}><td>{item.title}</td><td>${item.cost}</td><td><AddToCart item={item} /></td></tr>
            });
            return (
                <table className="table table-hover">
                    {items}
                </table>
            )
        }
    });

Yep, App.js example file was not updated.

/** @jsx React.DOM */
var React = require('react');
var Catalog = require('../components/app-catalog.js');
var Cart = require('../components/app-cart');
var APP =
    React.createClass({
        render: function () {
            return (
                <div>
                    <h1>Lets shop</h1>
                    <Catalog />
                    <h1>Cart</h1>
                    <Cart />
                </div>
            )
        }
    });
module.exports = APP;

I've made the change suggested by others here (thanks!) but still come unstuck.

Tracing as best I can, when I click on the Add To Cart button, I can see the handleClick function fire, the VIEW_ACTION being dispatched from the app-dispatcher with an ADD_ITEM actionType, _addPromise being called in the dispatch method of the base dispatcher, but Promise.all(_promises).then(_clearPromises); never seems to resolve and fire the "then" clause.

Not of the events seem to be emitted.

Would be nice if the files provided worked/up to date :( even after following advice above still getting:

Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of Catalog. See http://fb.me/react-warning-keys for more information.

I'm getting the following error: "module "react/lib/merge" not found"

I'm guessing this stems from the boilerplate dispatcher code. Did I have to do anything to install the module that I missed?

Try checking out the flux website and getting the copy of the dispatcher from there under 'Creating a Dispatcher'. https://facebook.github.io/flux/docs/todo-list.html. It requires installation of the es6-promise module and object-assign, but I've found so far object-assign is the easiest way to get around the merge requirement since merge has been deprecated since this video was released.

I was getting the same issue. This worked for me. npm install merge var merge = require('merge');

If you're getting this error - "module "react/lib/merge" try doing this. npm install merge var merge = require('merge');

If you're getting this error - "module "react/lib/merge" try doing this. npm install merge var merge = require('merge');

Joe, one of the nice process related things about this course are the analysis & design wireframes, not only the interface mock-up but also the one showing what still needs to be implemented. Are you using any particular application to create these diagrams? Thanks for a great, up-to-date and very clear video series!

how does 'this.setState()' inside '_onChange' work? _onChange is passed to eventEmmiter. So won't 'this' point to a wrong object when '_onChange' is called by eventEmmiter? or am i missing something here?