reactjs - Apollo 客户端基于状态跳过查询

问题描述

使用 Apollo 客户端，我看到了如何根据此处所示的道具跳过查询https://ladwhocodes.com/graphql/skip-a-graphql-query-based-on-conditions/31/

但是，如果我想跳过根据状态变化调用我的查询怎么办。

我有一个查询设置为每 5 秒轮询一次，但我想在对话打开时暂停此轮询（以避免重新渲染对话的父组件，导致对话重新渲染，然后必须将光标聚焦在它所在的位置前）。

我试过这个，但它不起作用。我想要的行为可能吗？

PS：还尝试将对话打开/关闭状态移动到父组件，但这也不起作用。

const [scoreRunDialougeOpen, setScoreRunDialougeOpen] = useState(false)  

const { loading, data, error } = useQuery(GET_SELECTED_HEAT, {
    variables: {
        id: eventId
    },
    pollInterval: scoreRunDialougeOpen ? undefined : 5000,
    skip: scoreRunDialougeOpen,
});

标签： reactjsreact-apolloapollo-serverreact-apollo-hooks

嘿伙计们，我实际上设法让它在没有停止投票的情况下工作。我正在为一个沙盒项目简化我的演示，我让它完全按照我想要的方式工作

https://codesandbox.io/s/heuristic-pine-2cxi7?file=/src/EventList.js

最后，我真正想要的是对话框在打开时不被重新渲染（我认为停止轮询是实现这一目标的简单方法，但似乎不是）

所以你可以看到我所做的只是将对话框移动到与 UseQuery 相同的组件中并且它工作正常（因为在对话框中没有重新渲染）

在我原来的解决方案中，包含 Dialog 的子组件将查询数据作为道具接收，因此当数据更改时显然会重新渲染。

reactjs - Apollo 客户端基于状态跳过查询

问题描述

解决方案

推荐阅读