Using send built-in action

Question

I don't understand meaning and usage of "send" built-in action. You can see here https://codesandbox.io/embed/7467qk4rox a very simple example, with a machine with two parallel state nodes; the second one send events using send built-in action, but this action seems not to be catched, neither in first state node, neither in the second one.

Can you please help?

Answer 1

You can solve this by being specific about your target, here is a reference to the docs.

And this is what you're example would look like with the target modifications:

const machine = Machine({
    id: "myMachine",
    type: "parallel",
    states: {...},
    on: {
        THREE_KEY: {
            target: ['A.A1', 'B']
        }
    }
});

I've also forked your sandbox, and added a working example of this, so that when pressing the key "3", the "THREE_KEY" will target A.A1 & B.

Since your sending events between different states, you might also be interested in the newly added actors model, you can read more about that in the docs here .

I think another important point I can add here is about your use of "send" in the actions, refer to this section of the documentation which explains:

The send(...) function is an action creator; it is a pure function that only returns an action object and does not imperatively send an event.