Бесконечный загрузчик - PullRequest
       36

Бесконечный загрузчик

0 голосов
/ 30 января 2020

Я получаю URL-адреса изображений из API

 const [images, setImages] = useState([]);
 const loadedImagesCounter = useRef(0);
 const imagesCounter = useRef(null);

 useEffect(() => {
    const fetchImages = async () => {
      try {
        const response = await request({
          url: 'http://localhost:5000/image/get-images',
          params: { category }
        });
        setImages(response);
        imagesCounter.current = response.length;
      } catch {}
    };

    fetchImages();
  }, [setImages, category]);

Каждое изображение имеет onLoad с шагом loadedImagesCounter

{images.map((img, index) => {
  return (
    <li key={index} className="admin-images__item">
      <img
        onLoad={() => {
          loadedImagesCounter.current++;
        }}
        className="admin-images__img"
        src={`http://localhost:5000/${img}`}
      />
    </li>
  );
})}

Почему <Spinner /> компонент go бесконечно?

{loadedImagesCounter.current !== imagesCounter.current && <Spinner />}
...