What is a Payload in Redux context - redux

Question

Can someone please explain what exactly a Payload is in Redux context? In layman terms please, the technical term wasn't useful. Hence still the confusion.
What I understand is that Payload is the actual data that is transmitted over the network. Does this mean, Payload of an action in Redux context means that the data that is passed as a parameter while an action is emitted to change the Redux state?

Answer 1

tl;dr
Payload is a non-official, community accepted (de facto) naming convention for the property that holds the actual data in a Redux action object.
Official Documentation
The official documentation only states that a Redux action has to be a plain object and needs a string action type:
A plain object describing the change that makes sense for your application. ... Actions must have a type field that indicates the type of action being performed. Types can be defined as constants and imported from another module. It's better to use strings for type than Symbols because strings are serializable. Other than type, the structure of an action object is really up to you. If you're interested, check out Flux Standard Action for recommendations on how actions could be constructed.
Community Best Practices
Lots of things are not standardized in Redux so you have maximal flexibility to do the things in your own way, but since most of us don't want to come up with a custom solution to every little everyday detail, the community tends to establish best practices.
To separate this type from regular data the payload property is used. Now, on what should go into payload and what should be on the same level with it is debatable, but a popular standard (recommended by the official docs too) is the Flux Standard Action which states that among the official requirements you may add a payload, error, and meta property. Here the payload is defined as:
The optional payload property MAY be any type of value. It represents the payload of the action. Any information about the action that is not the type or status of the action should be part of the payload field. By convention, if error is true, the payload SHOULD be an error object.

Answer 2

Payload is what is keyed ( the key value pairs ) in your actions and passed around between reducers in your redux application. For example -
const someAction = {
type: "Test",
payload: {user: "Test User", age: 25},
}
This is a generally accepted convention to have a type and a payload for an action. The payload can be any valid JS type ( array , object, etc ).
Hope this clarifies your doubt!

Answer 3

An action object has a type:
{
type: "DELETE_POST",
id: 123
}
besides the type, it usually has some kind of data that provides more information about this action. This is called "payload". In the above action object, the id is the payload.
Some programmers would write it in such a way:
{
type: "DELETE_POST",
payload: {
id: 123
}
}
and it is mainly a matter of style / convention.
Some more details:
In some other situations, the payload could be an array of data, such as an array of JavaScript objects.
Wikipedia defined it quite well:
In computing and telecommunications, the payload is the part of transmitted data that is the actual intended message. Headers and metadata are sent only to enable payload delivery.
Can we say that the action type is also part of the payload? Perhaps we can, if we look at it this way:
instruction: BUY_FROM_SUPERMARKET
items: ["egg", "milk", "lettuce"]
In this case, I think it is reasonable to consider BUY_FROM_SUPERMARKET as part of the message and therefore, part of the payload, but in Redux, it is not, but I guess it is just the way it is.

Answer 4

https://redux.js.org/tutorials/fundamentals/part-2-concepts-data-flow
Actions
An action is a plain JavaScript object that has a type field. You can think of an action as an event that describes something that happened in the application.
The type field should be a string that gives this action a descriptive name, like "todos/todoAdded". We usually write that type string like "domain/eventName", where the first part is the feature or category that this action belongs to, and the second part is the specific thing that happened.
An action object can have other fields with additional information about what happened. By convention, we put that information in a field called payload.
A typical action object might look like this:
const addTodoAction = {
type: 'todos/todoAdded',
payload: 'Buy milk'
}