Question

在底部更新

我正在学习Flow并试图找到一种以类型安全的方式处理API响应的好方法。我正在使用API中间件，您可以在其中调度操作{ type: 'API', payload: { url, next: func } }，中间件会进行API调用并接下来调用。

我正在努力想出一种方法来动态创建执行验证的下一步操作。

我的行为如下：

type Action =
  | { type: "API", payload: apiPayload }
  | { type: "LOADED_TODOS", payload: Array<Todo> }
  | { type: "LOADED_ALBUMS", payload: Array<Album> }
  | { type: "LOADED_ALBUM", payload: Album };

调用API：

// action gen for response, this is what I'd like to generalize
const loadedTodos = (payload): Action => {
  const validData: Array<Todo> = validate(todosSchema, payload);
  return {
    type: "LOADED_TODOS",
    payload: validData
  };
};

const getTodos = (): Action => ({
  type: "API",
  payload: {
    url: "todos",
    next: loadedTodos
  }
});

我想用动态生成器替换loadedTodos（）。我尝试了很多东西，但这里有伪代码（Node<*>来自经过验证的包裹）：

function createAction<RT>(type: string, schema: Node<*>): (mixed) => Action {
  return function(payload: mixed): Action {
    // This throws if validate() fails. Otherwise we get a "good" payload
    const validData: RT = validate(schema, payload);
    return {
      type,
      payload: validData
    };
  };
}

目标是我不必为每个API响应编写动作生成器。

完整，可运行的示例，显示所有类型和＆＃34;已验证＆＃34;使用的模式：https://github.com/pasih/flow-api-example/blob/master/src/index.js

2017年4月20日更新

我取得了一些进展。

我现在有：

const getTodos = (): Action => ({
  type: "API",
  payload: {
    url: "todos",
    next: (payload: mixed, error?: boolean, meta?: mixed): Action => ({
      type: "LOADED_TODOS",
      payload: payload instanceof Error
        ? payload
        : validate(todosSchema, payload),
      meta,
      error
    })
  }
});

这接近我想要的。现在我可以使用＆＃34; API＆＃34;编写getAlbums（），updateWombat（）等。操作并指定下一个有效负载（即在完成API调用时要调用的内容），相当简洁。我仍然希望指定＆＃34; next＆＃34;更方便：

  ...
  url: "X",
  method: "GET",
  next: nextActionFactory("LOADED_TODOS", schemaType)

但我不确定这实际上是否适用于Flow。

更新了代码：https://github.com/pasih/flow-api-example/blob/master/src/index.js

流程：如何构建类型安全的动态动作生成器

0 个答案: