React study Notes (iv) Data flow

The life cycle of the data in the Redux application follows the following 4 steps:

1. Call Store.dispatch (action):

You can call Store.dispatch anywhere, including components, XHR callbacks, and even timers.

The 2.Redux store calls the incoming reducer function:

Store will pass two parameters to reducer, the current state tree and action

The 3.reducer should combine multiple sub-reducer outputs into a single State tree:

Redux provides a combinereducers () helper function to split the root reducer into multiple functions for processing one branch of the state tree, respectively.

function Todos (state = [], action) {   //  omit processing logic   ... return  'show_all', action) {   //  omit processing logic   ... return  = combinereducers ({   todos,   visibletodofilter});

The 4,redux store holds the full state tree returned by the root reducer:

This new tree is the application of the next state! All listeners that subscribe to Store.subscribe (listener) will be called, and the listener can call Store.getstate () to get the current state.

React study Notes (iv) Data flow