仅在获取数据时加载状态

Question

我试图在仅获取数据时显示加载程序，而不是着陆到页面上以及获取数据时首先显示加载器...有什么想法吗？

这是我目前正在做的

const handleSearchClick = async () => {

            setItems([]);

            setIsActive(true);

            const { data: { items } } = await fetchData(

                `${process.env.REACT_APP_URL}${page}`,

            );

            items.length && setIsActive(false);

            setPage(1);

            setItems(items);

};

<container>

    <SearchBarContainer>

           <SearchBar

               onClickButton={handleSearchClick}

               onValueChange={handleChange}

               value={value}

               pageNum={page}

            />

    </SearchBarContainer>

    {!isActive ? (/*Display data*/) : 

    (

        <LoaderContainer>

            <RingLoader size={100} />

        </LoaderContainer>

     )}

</container>