Skip to content
Version: xstate@5.0.0

fromCallback() function​

An actor logic creator which returns callback logic as defined by a callback function.

Signature:

export declare function fromCallback<TEvent extends EventObject, TInput = unknown>(invokeCallback: InvokeCallback<TEvent, AnyEventObject, TInput>): CallbackActorLogic<TEvent, TInput>;

Parameters​

ParameterTypeDescription
invokeCallbackInvokeCallback<TEvent, AnyEventObject, TInput>The callback function used to describe the callback logic The callback function is passed an object with the following properties: - receive - A function that can be called with a listener function argument; the listener is then called whenever events are received by the parent actor - sendBack - A function that can send events back to the parent actor - input - Data that was provided to the parent actor - self - The parent actor performing the callback logic - system - The actor system to which the parent actor belongs The callback function can (optionally) return a cleanup function, which is called when the parent actor is stopped.

Returns:

CallbackActorLogic<TEvent, TInput>

Callback logic

Remarks​

Useful for subscription-based or other free-form logic that can send events back to the parent actor.

Actors created from callback logic (“callback actors”) can: - Receive events via the receive function - Send events to the parent actor via the sendBack function

Callback actors are a bit different from other actors in that they: - Do not work with onDone or onError - Do not produce a snapshot using .getSnapshot() - Do not emit values when used with .subscribe() - Can not be stopped with .stop()

Example​

const callbackLogic = fromCallback(({ sendBack, receive }) => {
let lockStatus = 'unlocked';

const handler = (event) => {
if (lockStatus === 'locked') {
return;
}
sendBack(event);
};

receive((event) => {
if (event.type === 'lock') {
lockStatus = 'locked';
} else if (event.type === 'unlock') {
lockStatus = 'unlocked';
}
});

document.body.addEventListener('click', handler);

return () => {
document.body.removeEventListener('click', handler);
};
});