React-Apollo-GraphQL 通用查询和突变

Question

这个问题更多的是关于设计。 在我的繁重应用程序中，想要实现通用突变和查询操作。 我的第一个想法是实现一个 function 将所有查询或突变封装在一个地方。 像这样：

function query(props) {
  const Query = require('dynamic/query/based/on/props.path.gql');
  const { data, loading, ...} = useQuery(Query, ...);
  return { data, loading, ... };
}

然后使用它

import Query form './query';
function SomeMainFunction(props) {
  cont { data, loading, ...} = Query(props);
  return data.map(...);
}

（与突变类似）在我看来，即使使用React.memo也会导致不必要的重新渲染。 第二种方法是利用useContext 。 但在这种情况下，我真的不知道如何处理网络状态。 意味着先loading true然后再加载false 。 还是useQuery会在数据到达后通过重新渲染组件来处理这个问题？

当然，第三种解决方案是直接在函数/组件中实现这个逻辑。 由于代码拆分，我不想要的东西。

Answer 1

我最终使用了上述设计并正确使用了memo ，它解决了我的问题。