天天看點

Angular reducer第一次被架構調用的單步調試細節

Reducer: 純粹的函數,接收目前狀态,以及最新的action,計算出最新的action.

selector: 純函數,用于select,derive和compose pieces of state

Store和State的差別

State is accessed with the store, an observable of state and an observer of actions.

Store是state和action的Observable.

reducer第一次被系統調用:@ngrx/store/update-reducers:

Angular reducer第一次被架構調用的單步調試細節

type:@ngrx/store/update-reducers

store也是一個Observable:

Angular reducer第一次被架構調用的單步調試細節

上一次的action:

Angular reducer第一次被架構調用的單步調試細節

store的source字段裡,根據feature名稱example找到state初始值0:

Angular reducer第一次被架構調用的單步調試細節

下面再觀察store.select的執行:

Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節

source$就是應用的this.store:

Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節

scheduler.js:

Angular reducer第一次被架構調用的單步調試細節

注意,一旦調用了flush方法之後,我們的reducer被回調:

Angular reducer第一次被架構調用的單步調試細節

action導緻counter值變為1之後,需要通知subscriber:

Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節
Angular reducer第一次被架構調用的單步調試細節

繼續閱讀