react, redux concept

redux core concepts

Let’s tell an older story first

In the early days of newspapers, if you wanted to know about the world, you had to read the newspaper. People who wanted to read the newspaper had to subscribe to the newspaper, right?

At the beginning of the year, a certain A called the newspaper, and I wanted to subscribe to a newspaper for one year, so that every day major news in Shenzhen would be known.

On a certain day in June, a village in a city in Shenzhen was to be demolished.

The newspaper reporter collected the news, edited it, reviewed it, and printed the newspaper.

The next day, when A received the newspaper, he learned that a lot of monopoly appeared in a village in Shenzhen.

This is a bad story to illustrate the core concepts of redux, but you must understand the mode of the story

Now let’s look at the core concepts of redux

redux work flow

As shown in the figure, the core concepts of redux are store, reducer, state, and action.

We will explain these concepts step by step to help understand redux , of course, we will associate redux with newspaper subscription

The principle of redux is similar to the story of this newspaper subscription, it is also in the observation-subscriber model


store is similar to a newspaper

A newspaper office that manages all the news, manages the people who subscribe to it, and is responsible for distributing the news

Store, similar to a newspaper, stores all the status data of the application, the manager subscribes to status changes, and distributes messages to subscribers


action means event

Newspaper incidents refer to things that have happened in various places, such as when a place is to be relocated, someone is smashed by a high-altitude object, and a road is being dug

The events in redux are similar. The application requests a module to modify the state.


After the newspaper reporter received the news incident, he went to the place where the incident happened to interview and record, then edited, wrote, reviewed, and finally printed it into a newspaper.

Redux’s reducer is to obtain new state data after receiving the event and after the reducer process

So, to simplify, redux is to store a lot of state data. Once a module requests the store to modify the state data, the store
After modifying the status data, the modules that are concerned about these data changes are finally notified, because these modules are subscribed to the store

Persist in original technology sharing, your support will encourage me to continue to create!