乐趣区

关于sap:关于-SAP-Spartacus-Loader-Meta-Reducer-的用途

jiezi

为了给用户更好的反馈，基于他们的行为，咱们常常须要保留诸如“正在加载购物车”、“获取用户地址失败”等信息。对于每个独自的应用程序状态，咱们必须将元数据放在旁边。别离用于购物车、用户信息、产品数据等。在所有这些中央手动实现这个逻辑会导致在整个代码库中针对同一问题有不同的解决方案。这就是在 spartacus 中创立 loaderReducer 的起因。这个 reducer 标准化了整个状态树 (state tree) 中的元数据处理。您能够在树的任何深度、任何须要的中央应用它。除了 reducer，咱们还提供 actions 和 selectors 的实用程序。

一个例子：

在 app.module.ts 里插入如下代码：

export class AppModule { 
  constructor(private config: DebugConfig,
    private actions$: Actions){// console.log('Jerry config:', this.config);
    this.actions$.pipe(ofType(CartActions.LOAD_CART),
      map((action: CartActions.LoadCart) => action.payload),
      tap((data) => console.log('Jerry cart:' , data))).subscribe();}

}

运行时成果：

Error 是常常搁置在 NgRx Store 中的 AJAX 调用状态之一。其余状态包含 Loading，Loaded 和 Success 等等。

interface ResultState {
  result: Result,
  error: string|null,
  isLoading: boolean,
  isLoaded: boolean,
}

为什么将这些状态放入 Store？嗯，这通常是由用户体验决策驱动的。例如，用户应该可能在期待调用实现时看到某种进度指示器，或者如果调用后果出错时，能看到谬误音讯。

SAP Spartacus 采纳了对立的工具 reducer，名为 loaderReducer，来为 entity 加载增加不同的标记位：

Higher order reducer that adds generic loading flag to chunk of the state. It utilizes “loader” meta field of actions to set specific flags for specific action (LOAD, SUCCESS, FAIL, RESET)

将通用加载标记增加到状态块的高阶 reducer. 它利用“加载程序”元操作字段来设置特定操作的特定标记（加载、胜利、失败、重置）

一旦某个 entity 加载胜利之后，首先触发高阶 reducer：

留神这行语句：

return Object.assign(Object.assign({}, state), {value: reducer ? reducer(state.value, action) : action.payload, loading: false, error: false, success: true });

显式将 state 里的 loading 字段硬编码为 false. 这样无需应用程序手动批改 loading 标记位了。

更多 Jerry 的原创文章，尽在：” 汪子熙 ”:

退出移动版