这个问题更多的是关于设计。在我的繁重应用程序中,想要实现通用 突变和查询操作。我的第一个想法是实现一个将所有查询或突变封装在一个地方的函数。像这样:
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在数据到达后通过重新渲染组件来处理这个问题?
当然,第三种解决方案是直接在函数/组件中实现这个逻辑。由于代码拆分,我不想要的东西。