1. 7
    Trigger Actions When Entering and Exiting a XState State
    2m 45s

Trigger Actions When Entering and Exiting a XState State

Kyle Shevlin
InstructorKyle Shevlin

Share this video with your friends

Send Tweet

Actions aren't limited to being called on transitions. They can also be called when we enter or exit a state node. This is done through the entry and exit properties.

The API for entry and exit actions is the same as that for actions on transitions. It can receive a single function or an array of functions, each which will be called with the next context and the event object that caused the transition.

This is a powerful way to fire side effects based on states rather than transitions.

//...
states: {
  broken: {
    entry: [
      (context, event) => {
        sideEffectToFireWhenWeEnterTheBrokenState(context, event)
      }
    ],
    exit: [
      (context, event) => {
        sideEffectToFireWhenWeExitTheBrokenState(context, event)
      }
    ]
  }
}