架構設計知識梳理(2) Flux

澤毛發表於2017-12-21

一、概述

Flux.png
Flux的特點:

  • 資料是單向的
  • App被分為三個部分 ViewApp介面,它根據使用者互動創造相應的響應ActionDispatcher:處理中心,接收各種Action並路由到對應的StoreStore:維護App各個模組的資料狀態,他們會根據當前的動作Action處理不同的業務狀態,會產生一個change事件來通知View更新狀態。
  • Action是一個簡單的Java物件,包含typedata

二、Action

TypeString型別標示事件型別。 DataMap型別,攜帶這個動作需要的資料。

Bundler data = new Bundle();
data.put("USER_ID", id);
Action action = new ViewAction("SHOW_USER", data);
複製程式碼

三、Store

Store模組包含了App狀態和業務邏輯,它能管理各種物件的狀態而不是一個。 Store必須暴露一個介面來獲取App狀態,這樣View模組就可以訪問Store模組來更新UI

Flux Store.png
Store的職責不是用來從外部獲取資料,而是用來跟蹤通過Action獲取的資料。

四、網路請求和非同步回撥

非同步網路請求是通過Action Creator觸發的,API Adapter模組負責請求API並返回結果,最後Action Creator會把相應的Action和資料傳送出去。 Store完全是同步模型,這樣使Store的內部邏輯更簡單。 所有的Action都是通過Action Creator觸發的,把所有的Action都集中在一個地方,容易排查bug

五、Todo App原始碼

1.1 actions/Action:一個Action對應一個事件,並且包含了該事件相關聯的資料。 1.2 actions/ActionCreator:這是一個單例模式,他構造時需要傳入一個Dispatcher物件,封裝一些方法,並通過Dispatcher分發出去。

public static ActionCreator get(Dispatcher dispatcher) { //ActionCreator和Dispatcher類似,都是單例模式。
    if (instance == null) {
        instance = new ActionCreator(dispatcher);
    }
    return instance;
}

public void create(String text) {
    dispatcher.dispatch(TodoActions.TODO_CREATE, TodoActions.KET_TEXT, text);
}
複製程式碼

1.3 actions/TodoActions:封裝Action相關的常量。

dispatcher/Dispatcher:這也是一個單例模式,他構造時需要傳入一個Bus物件,它提供了registerunRegister,並通過bus傳送出去。

//構造時和Bus相關聯。
public static Dispatcher get(Bus bus) {
    if (instance == null) {
        instance = new Dispatcher(bus);
     }
     return instance;
}
複製程式碼

model/Todo:表示一個事件。 stores/Store:它是一個介面,同樣和Dispatcher相關聯,他的子類是TodoStore。 整個資料流的流程是:

Activity發起事件 -> ActionCreator#xxx -> Dispatcher#dispatch -> Bus#post -> TodoStore#onAction -> TodoStore#emitChange -> Bus#post -> Activity#onTodoStoreChange
複製程式碼

Activity接收資料的流程

Activity#onTodoStoreChange -> updateUi -> TodoStore#getTodos()
複製程式碼

相關文章