Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pass action result to action listener in a component #24

Open
slawekkolodziej opened this issue Mar 14, 2016 · 0 comments
Open

Pass action result to action listener in a component #24

slawekkolodziej opened this issue Mar 14, 2016 · 0 comments

Comments

@slawekkolodziej
Copy link

Assume the following structure:

actions/category.js:

import { BaseActions } from 'fluxapp';

class CategoriesActions extends BaseActions {
  select(id) {
    return id;
  }
}

fluxapp.registerActions('categories', CategoriesActions);

stores/categories.js:

import fluxapp, { BaseStore } from 'fluxapp';

class CategoriesStore extends BaseStore {
  static actions = {
    onSelectCategory : 'category.select',
  }

  onSelectCategory(id) {
    console.log(id, '<-- store');
  }
}

fluxapp.registerStore('categories', CategoriesStore);

movies.jsx:

import { Component as FluxappComponent } from 'fluxapp';

class Movies extends FluxappComponent {
  static actions = {
    onSelectCategory : 'category.select:after',
  };

  onSelectCategory(id) {
    console.log(id, '<-- component');
  }
}

categories.jsx:

import { Component as FluxappComponent } from 'fluxapp';

class Movies extends FluxappComponent {
  selectCategory() {
    this.getActions('categories').select(42);
  }

  render() {
    return (
      <button onClick={ this.selectCategory.bind(this) }>
          Select category
      </button>
    );
  }
}

Now if I click the button in categories.jsx I'll get the following output:

42 <-- store
undefined <-- component

If I update the component's actions to this:

static actions = {
  onSelectCategory : 'category.select',
};

I get the rendering error.

I noticed that it's impossible to bind directly to an event like category.select within the component because of this check: https://github.com/colonyamerican/fluxApp/blob/master/lib/componentMixin.js#L77-L81

If it's there by design, to force developer to bind to either event success or failure, then it'd be nice to have the action result in the ":after" event: https://github.com/colonyamerican/fluxApp/blob/master/lib/actions.js#L87-L88

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant