isFetchingとisLoadingの違い
from useQueryのreturns
table:isFetchingとisLoadingの比較
isFetching isLoading
cacheがない。serverからfetchする true true
cacheがある。cacheから取得し、backgroundでserverからfetchする true false
cacheがある。cacheから取得し、backgroundではserverにアクセスしない false false
Viewに「loading..」を出したいだけならisLoadingを使ったほうがいいmrsekut.icon
isFetchingを使うと、Viewには何も変更がないのに度々loadingが出る可能性がある
keepPreviousDataを有効にする際は、isPreviousDataなども検討すると良い
3つ目↑の条件の作り方は、例えば
code:ts
const Main = () => {
const a = useQuery('a', fn, {staleTime: Infinity});
return <F/>
}
const F = () => {
const isShow, setShow = useState(false);
return (
<div>
{isShow && <G/>}
<button onClick={() => setShow(s => !s)}>fetch</button>
</div>
);
};
const G = () => {
const a = useQuery('a', fn, {staleTime: Infinity});
return <div>g</div>;
};
同じkeyでfetchするやつを、staleTime: Infinityにして、タイミングをずらして画面上に2つ出せば良い