Reactjs 尝试在Apollo useQuery的上下文中显示通知时，React.js会出现重新呈现问题

这就是我要做的。我已经创建了一个全局通知上下文，其中包含一个用于更改状态的缩减器

我现在的问题是，我正在使用Apollo挂钩执行查询

useQuery

，当出现错误时，我希望在全局通知中显示它

为此，我需要发送到reducer以显示通知，更改通知中的标题和消息

这会触发全局通知上下文上的状态更改，从而触发重新提交程序，再次触发

useQuery

。如果您每次都有错误响应，所有这些都会触发无限重序

是否有人建议建立一个全球通知系统来解决这个问题

我剩下的唯一解决方案是在我需要通知的每个页面上导入通知

代码：

  const [state, dispatch] = useContext(NotificationsContext);
  const { loading, error, data } = useQuery(GET_USERS);

  useEffect(() => {
    if (error) {
      dispatch({
        type: 'ERROR',
        payload: {
          title: 'Query Error',
          subtitle: error.message,
        },
      });
    }

    if (!loading && data) {
      const newData = [];
      data.getUsers.users.forEach((user) => {
        const newUserRow = {};
        headers.forEach((header) => newUserRow[header] = user[header]);
        newData.push(newUserRow);
      });
      setRows(newData);
    }
  }, []);

---

我认为您正在使用functional component，您可以通过在

useffect

钩子中使用

useQuery

来解决这个问题，也不要忘记将空数组作为

useffect

的第二个参数传递

希望这能解决你的问题

---

嗨，拉凯什，非常感谢您的投入。是的，我正在使用一个功能组件。我理解你的解决方案，在这里发布之前我已经尝试过了。问题是useEffect将只运行一次。Apollo useQuery可以在返回真实答案之前进行一些回调。因此，在deps中使用空白数组的useEffect将不起作用。因为它需要在整个过程中检查更改。@GeorgSteyn我知道您一定尝试过useEffect方法，将第二个参数传递给它

[data]

，这样每当数据更改时它都会呈现。