(A short Redux note)

What is a Redux?

  • Redux is a state management container for JavaScript
  • Can be used to provide predictable state management, with an emphasis on state management

The core concept

  1. Store

The createStore function can be used to generate a Store. CreateStore takes a function as an argument and returns the newly generated Store 2.action

  • An Action is an object with a required propertytypeRepresents the name of the Action.
  • Action describes the current event and is the only way to change state;
  • When the View issues the Action, the data gets shipped to the state and then the state changes.
  1. Reducer
  • Reducer is a function that accepts Action and the current state as parameters and returns the new state.
  • After the Store receives the action, a new state is given and the view is changed. This process is called reducer (also known as state calculation)

API:

  1. store.getState()
    • The current state can be obtained by using store.getState(). State is a collection of data at a point in time.
  2. store.dispatch(action)
    • Is the only way a View can issue an action. Store. dispatch takes an action object and sends it.

Other concepts:

  1. Action Creator

Define a function to generate Action, called Action Creator

  1. Pure functions
  • Parameter unchanged, do not call system I/O API;
  • The same input must produce the same output;
  • Reducer is a pure function
  1. store.subscribe()
  • Used to set up the listening, which is automatically executed when state changes
  1. Redux Flow

  1. Difference between Redux and React-Redux
  • Redux is a JavaScript library for state management (not just React, Angular, etc.);
  • React-redux is the official React binding library for Readux. It enables the React component to read data from the Redux store and issue actions to the store to update data.