在哪里进行 API 调用以及如何构建操作

Posted 2023-02-19

【中文标题】在哪里进行 API 调用以及如何构建操作

【英文标题】：Where to make API call and how to structure actions

【发布时间】：2019-06-30 15:25:11

【问题描述】：

我最近开始从 ngrx 迁移到 ngxs，并且有一个设计问题，即我应该将一些调用放在哪里。

在 NGRX 中，我将为与 api 的每次交互创建 3 个操作。比如：

GetEntities - 表示已进行初始 api 调用 GetEntitiesSuccess - 表示成功返回数据 GetEntitiesFail - 表示返回数据不成功

我将创建一个效果来监视实际调用 API 的 GetEntities 操作，并通过调用带有结果有效负载的成功/失败操作来处理响应。

在 NGXS 中，我是在操作发生时从存储本身进行 api 调用，还是应该使用其他一些 NGXS 对象来处理这些 API 调用，然后以与我在 ngrx 中相同的方式处理这些操作（通过每次调用创建多个操作）？

【参考方案1】：

我见过的大多数示例，以及我如何使用它是从状态中的操作处理程序进行 API 调用，然后当 API 返回时立即修补状态。

然后在补丁调用之后，如果需要，您可以发送一个动作来指示成功/失败。像这样的：

@Action(GetSomeData)
loadData( patchState, dispatch: StateContext<MyDataModel>, payload: GetSomeData) 

   return this.myDataService.get(payload.id)
   .pipe(
      tap((data) => 
        patchState( data: data);
        // optionally dispatch here
        dispatch(new GetDataSuccess());
      )
   ); 
  

这个 q/a 也可能有用Ngxs - Actions/state to load data from backend