关于 SAP Spartacus Loader Meta Reducer 的用途

2021年09月15日 阅读数:3
这篇文章主要向大家介绍关于 SAP Spartacus Loader Meta Reducer 的用途,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。

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

一个例子:java

在 app.module.ts 里插入以下代码:typescript

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();
  }

}

运行时效果:
app

Error 是常常放置在 NgRx Store 中的 AJAX 调用状态之一。 其余状态包括 Loading,Loaded 和 Success 等等。工具

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

为何将这些状态放入 Store? 嗯,这一般是由用户体验决策驱动的。例如,用户应该可以在等待调用完成时看到某种进度指示器,或者若是调用结果出错时,能看到错误消息。this

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. 它利用“加载程序”元操做字段来设置特定操做的特定标志(加载、成功、失败、重置)
spa

一旦某个 entity 加载成功以后,首先触发高阶 reducer:code

注意这行语句:ip

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的原创文章,尽在:"汪子熙":