First use crA scaffolding to install the React project
create-react-app xx
1. Basic usage
(1) Create a store directory structure under SRC
The file structure is temporarily as follows
When using redux state in a component, you first import store. You can retrieve the state in redux by using store.getState()
Click the button to change the state of num in redux
First bind the button to a click event
To modify redux, actions should be distributed to Reducer in actionCreator, so the action creator file is as follows
Actions are accepted in reducer and the state in REdux is changed according to the identification of the actions by implementing relevant logic
Use the actionCreator method in the component
At this point we find that the number does not change when the button is clicked, because the component does not receive state changes in redux, and we need to listen for redux changes
That’s basic redux in React
2. Redux
Start by installing React-Redux in your project
npm install –save react-redux
Include Provider in APP outer layer and mount property store. Provider is introduced in react-redux.
Change the actionCreator file to
When used in a component, both the set state and the listener can be undone
Note: The reducer must be a pure function. There must be no non-pure operation and no change to the previous state. It must be a synchronous operation. The new state is compared to the previous state, and the view is not rendered if the new address of the operation is the same as the old one. (Deep copy available)
Due to the time, write in a hurry, if there is any mistake please forgive me, and put forward valuable suggestions