是否有一种方法可以在组件挂载时重新获取数据?目前,使用react-router时,如果我在应用程序中导航,它会获取一次数据,然后如果我导航离开并返回,数据仍然是旧的,而不是新的请求?
我还没有将fetch调用包装在useEffect中。
const fetchInfo = async () => {
const res = await fetch(`/api/${id}`);
return res.json();
};
const { data, status } = useQuery('tableInfo', fetchInfo, {
staleTime: 5000,
});
使用as:
{status === 'error' && (
<div className="mt-5">Error fetching data!</div>
)}
{status === 'loading' && (
<div className="mt-5">Loading data ...
</div>
)}
{status === 'success' && (
<div className="mt-5">
<p>Result will be here</p>
</div>
)}
发布于 2021-10-21 05:21:12
使用您的设置,如果您获取数据,移动到另一个视图并返回(至少5秒后),它将重新获取-如果您导航并在这5秒之前返回-它应该不会。
如果您认为数据不会随着时间的推移而变得陈旧(或不会很快),则将staleTime
设置为大于5秒(最高可达Infinity
),从而防止重新获取数据。
如果您想在每次导航到视图时重新获取数据-根本不要设置staleTime
https://stackoverflow.com/questions/69662092
复制相似问题