如何将 Redux 应用程序转换为 GraphQL/Apollo?
How to convert Redux app to GraphQL/Apollo?
我正在重构一个使用 redux 的 express+react 应用程序,我想切换到 graphql (apollo),但我有一些不太清楚的地方。
所以一般的流程是有 GET 请求来获取数据(对象数组),然后将这些数据存储在 redux 存储中,并使用分页的选择器作为列表呈现。然后用户可以编辑条目(条目在 redux store 中修改),然后他可以“发布”从 redux store 获取数据并调用 POST 端点。
我将如何在 graphql 中建模?我是否使用 graphql 查询进行分页(在数据库中使用 offset/limit)?
我如何才能修改内存中的条目并在完成编辑后立即发布所有条目?
在 Apollo 中很简单:
- 获取的数据存储在规范化缓存中(列表和项目分开);
- 组件可以使用
useQuery
钩子来获取数据(使用缓存客户端);
- 呈现具有编辑功能的项目;
- 在您的
onChange
/onSave
事件中调用变异函数(从 useMutation
挂钩返回)将一个或多个记录数据(您想要更新)作为变量传递;
- 发送到 API 的数据产生响应(突变解析器),您可以使用(在
onCompleted
处理程序中)更新本地缓存(writeQuery
)或调用重新获取查询(通过调用fn/handler 来自 useQuery
),两者都将强制使用更新的数据重新渲染组件;
是的,可以使用查询变量、获取更多等来完成分页
我正在重构一个使用 redux 的 express+react 应用程序,我想切换到 graphql (apollo),但我有一些不太清楚的地方。
所以一般的流程是有 GET 请求来获取数据(对象数组),然后将这些数据存储在 redux 存储中,并使用分页的选择器作为列表呈现。然后用户可以编辑条目(条目在 redux store 中修改),然后他可以“发布”从 redux store 获取数据并调用 POST 端点。
我将如何在 graphql 中建模?我是否使用 graphql 查询进行分页(在数据库中使用 offset/limit)? 我如何才能修改内存中的条目并在完成编辑后立即发布所有条目?
在 Apollo 中很简单:
- 获取的数据存储在规范化缓存中(列表和项目分开);
- 组件可以使用
useQuery
钩子来获取数据(使用缓存客户端); - 呈现具有编辑功能的项目;
- 在您的
onChange
/onSave
事件中调用变异函数(从useMutation
挂钩返回)将一个或多个记录数据(您想要更新)作为变量传递; - 发送到 API 的数据产生响应(突变解析器),您可以使用(在
onCompleted
处理程序中)更新本地缓存(writeQuery
)或调用重新获取查询(通过调用fn/handler 来自useQuery
),两者都将强制使用更新的数据重新渲染组件;
是的,可以使用查询变量、获取更多等来完成分页