An action is the plain object that describes what happened, and an action creator is a function that builds and returns that object. You dispatch the action. The action creator just saves you from writing the object by hand.
An action has a type property and usually a payload. An action creator takes arguments, such as the amount to add, and puts them into the payload. That keeps the action's shape in one place, so every caller sends the same structure.
An action creator can also prepare data before the action exists, like a generated ID or a timestamp. In Redux Toolkit you rarely write one yourself, because createSlice generates an action creator for every reducer you define.
// Action
const action = { type: 'INCREMENT', payload: 1 };
// Action creator
const increment = (value) => ({
type: 'INCREMENT',
payload: value
});
This answer doesn't lend itself to a diagram - it reads best . No credits were charged.
Why there's no diagram: “”
The interactive diagram is below the answer - jump to diagram ↓ · Below it, the related concept . Jump to it ↓
The diagram below the answer is the concept . Jump to it ↓