Reactjs useQuery未返回最新数据 我有一个主页（/home），上面有一个产品列表作为卡片（已检索） 通过useQuery），每个都有一个向上投票按钮 当我点击upvote时， 我触发一个向上投票的变异+一个更新投票的UI更改 计数 当我转到另一页，然后返回到/home， useQuery无法检索到票数正确的产品 但是，当我检查数据库时，所有产品都有正确的投票 伯爵

为什么

useQuery

在我完成另一页之前不返回正确的金额 刷新

以下内容仅供参考：

const Home = props => {
  const {data, loading, error} = useQuery(GET_PRODUCTS_LOGGED_IN, {
    variables: {
      userid: props.userid
    }
  });
  
  console.log(
    'data', data.products // this data is outdated after I go from /home -> /profile -> /home
  );

  return (
    <Container>
      {_.map(data.products, product => (
        <VoteButton
          hasVoted={product.hasVoted}
          likes={product.likes}
          productid={product.productid}
        />
      ))}
    </Container>
  );
}

const Home=props=>{
const{data，loading，error}=useQuery（获取产品登录）{
变量：{
userid:props.userid
}
});
console.log(
“data”，data.products//在我从/home->/profile->/home离开后，此数据已过时
);
返回(
{}.map（data.products，product=>(
))}
);
}

const-VoteButton=（{likes，hasvided，productid}）=>{
const[LocalHasDrived，UpdateLocalHasDrived]=useState（HasDrived）；
const[likescont，updatelikescont]=useState（likes）；
const[onVote]=使用变异（投票产品）；
const onClickUpvote=（事件）=>{
投票表决({
变量：{
产品ID
}
})
UpdateLocalHasDrived（！LocalHasDrived）；
UpdateLikeCount（LocalHasDrived？LikeCount-1:LikeCount+1）；
}
返回(
{likecount}
);
};

在useQuery调用中，您实际上可以向它传递一个名为“fetch policy”的配置选项，该选项告诉Apollo您希望在调用或使用缓存之间如何执行查询。您可以在此处找到更多信息。 一个快速的解决方案是将fetch策略设置为缓存和网络，如下例所示

  const {data, loading, error} = useQuery(GET_PRODUCTS_LOGGED_IN, {
    variables: {
      userid: props.userid
    },
    fetchPolicy: 'cache-and-network',
  });

您也可以这样做，当您的变异发生时，它将通过在useMutation上设置“refetch queries”选项再次运行您的查询，如下面的代码所示。 这将导致您的查询在突变发生后立即触发。 你可以在这里了解更多

---

在useQuery调用中，您实际上可以向它传递一个名为“fetch policy”的配置选项，该选项告诉Apollo您希望查询在调用或使用缓存之间如何执行。您可以在此处找到更多信息。 一个快速的解决方案是将fetch策略设置为缓存和网络，如下例所示

  const {data, loading, error} = useQuery(GET_PRODUCTS_LOGGED_IN, {
    variables: {
      userid: props.userid
    },
    fetchPolicy: 'cache-and-network',
  });

您也可以这样做，当您的变异发生时，它将通过在useMutation上设置“refetch queries”选项再次运行您的查询，如下面的代码所示。 这将导致您的查询在突变发生后立即触发。 你可以在这里了解更多

---

你可能正在apollo客户端中使用缓存，你需要手动更新，这很烦人：啊，伙计，我讨厌这种使用“仅网络”策略，如果你不想与[“烦人的”]缓存更新进行“斗争”]你可能在apollo客户端中使用缓存，你需要手动更新，这很烦人：啊，伙计，如果你不想与['烦人的']缓存更新“斗争”，我讨厌使用“仅网络”策略是的，我最终使用了

缓存和网络

，谢谢你的回复，虽然我最终使用了

缓存和网络

，但谢谢你的回复

const [onVote] = useMutation(VOTE_PRODUCT, {
  refetchQueries: [ {query: GET_PRODUCTS_LOGGED_IN } ],
});