Events

View all event definitions.

Events are signals that something has occurred that send relevant data with their occurrence. For example, the products_updated event indicates that products have been updated, and sends the new products with the event.

Events are useful in that components, services, and other entities within an implementation can listen for them and do something in response. This section below describes how to listen for events via FluxCapacitor, as well as directly from components. This section also includes documentation on how to emit events using FluxCapacitor.

FluxCapacitor

all

To listen on a collection of events via FluxCapacitor, use all().

const onProductsAndTemplateUpdated = () => {
  // Do something after the `products_updated` and `template_updated` events have been emitted.
}

this.flux.all(['products_updated', 'template_updated'], onProductsAndTemplateUpdated);

allOff

To remove a callback for a given collection of events via FluxCapacitor, use allOff().

this.flux.allOff(['products_updated', 'template_updated'], onProductsAndTemplateUpdated);

on

To listen for each occurrence of an event via FluxCapacitor, use on().

const onProductsUpdated = (products) => {
  // Deal with products
};

this.flux.on('products_updated', onProductsUpdated);

once

To listen for a single occurrence of an event via FluxCapacitor, use once().

this.flux.once('products_updated', (products) => {
  // Deal with products
})

off

To remove a callback for a given event via FluxCapacitor, use off().

this.flux.off('products_updated', onProductsUpdated);

emit

To emit an event and payload directly from FluxCapacitor, use emit().

this.flux.emit('my_custom_event', { foo: 'bar' });

Tag

subscribe

To register single event callbacks directly from a component, use subscribe(). Callbacks registered in this way will be invoked each time the event is emitted.

class MyCoolComponent {
  init() {
    this.subscribe('products_updated', this.onProductsUpdated);
  }

  onProductsUpdated(products) {
    // Do something each time 'products_updated' is emitted.
  }
}

subscribeOnce

For another approach to registering single event callbacks directly from a component, use subscribeOnce(). Callbacks registered in this way will be invoked in response to the first occurence of the event, then removed.

class MyCoolComponent {
  init() {
    this.subscribeOnce('products_updated', this.onFirstProductsUpdated);
  }

  onFirstProductsUpdated(products) {
    // Do something the first time 'products_updated' is emitted.
  }
}

subscribeWith

To register a callback for a collection of events directly from a component, use subscribeWith(). Callbacks registered in this way will be invoked whenever each event in the given collection has been emitted at least once.

class MyCoolComponent {
  init() {
    this.subscribeWith(['products_updated', 'template_updated'], this.doTheThing);
  }

  doTheThing() {
    // Do something when `products_updated` and `template_updated` have each been emitted at least once.
  }
}