Question

以下是该方案：

USER 1

1）进入登录页面
2）写入通过突变发送到服务器的电子邮件和密码
3）验证确定 - ＆gt;服务器返回令牌和用户信息（id，firstName，lastName）
4）令牌和每个用户信息存储在本地存储中的单独密钥中
5）用户被重定向到主页
6）用户转到个人资料页面
7）向服务器发送查询以检索有关该用户的所有信息（由于存储在本地存储中的用户ID）

以下是查询：

const PROFILE_QUERY = gql`
  query profileQuery($id: ID!) {
    getUser(id: $id) {
      firstName
      lastName
      email
    }
  }
`;

export default graphql(PROFILE_QUERY, {
  options: {
    variables: {
      id: localStorage.getItem("id")
    },
    errorPolicy: "all"
  }
})(ProfilePage);

8）服务器返回信息，用户可以在配置文件页面中看到它们
9）用户决定退出

所以一切都适用于第一个用户，现在第二个用户到达同一台计算机和同一个浏览器。

USER 2

与上一个用户相同的步骤，从1到7
发送到服务器以检索用户信息的查询无效，因为查询发送的id是前一个用户的id（并且不允许用户检索有关其他用户的信息）

如果我进行浏览器刷新，则会使用良好的用户ID发送查询...

那么为什么第一次尝试时不刷新id变量（看起来像本地存储中的id值）？我该如何解决这个问题？

感谢您的帮助。

Answer 1

这是因为您的options字段是静态的，并且在首次加载包含查询的文件时进行评估。（我假设在某处，可能是步骤3或4，本地存储中的id已正确更新为第二个用户。）

config.options可以是您现在传递的对象，也可以是查询需要时评估的函数。

所以要每次从id加载localStorage而不只是一次，你可以这样做：

options: () => ({
  variables: {
    id: localStorage.getItem("id")
  },
  errorPolicy: "all"
})

Answer 2

然后第一个用户退出，您需要重置Apollo商店并清除本地存储。

如何在react-apollo中刷新变量

2 个答案: