Demoing a uniform data flow

Ok, so we have described the parts our application consists of:

• A view where a user is able to select an index
• A dispatcher that allows us to send a message
• A store that contains our selected index
• A second view where the selected index is read from the store

Let's build a real app from all of this. The following code is found in the code repository under Chapter2/demo.

Creating a selection view

First off we need our view in which we will perform the selection:

// demo/selectionView.js

import dispatcher from"./dispatcher";

console.log('selection view loaded');

class SelectionView {
selectIndex(index) {
    console.log('selected index ', index);
    dispatcher.dispatch({
      type: "SELECT_INDEX",
      data: index
    });
  }
}

const view =new SelectionView();
exportdefault view;

We have bolded the   selectIndex()   method above that we intend to use.

Adding the dispatcher

Next off we need a dispatcher that is able to take our message, like so:

// demo/dispatcher.js...