Как организовать delay в react.js?

@roma 

В React.js, для организации задержки (delay) можно использовать функцию setTimeout(). Эта функция вызывает переданную ей функцию через заданное количество миллисекунд.

Пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

import React, { useState, useEffect } from "react";

function DelayedText() {
  const [text, setText] = useState("");
  
  useEffect(() => {
    const delay = setTimeout(() => {
      setText("Delayed text");
    }, 1000);
    
    return () => clearTimeout(delay); // очистка задержки при unmount
  }, []);
  
  return <p>{text}</p>;
}

В этом примере мы используем useEffect() для установки задержки в 1 секунду. Внутри useEffect() мы вызываем setTimeout(), который вызовет функцию setText() через 1 секунду и установит значение text в "Delayed text". Мы также используем clearTimeout() для очистки задержки, если компонент размонтируется.

В результате, компонент DelayedText будет рендериться без текста, затем через 1 секунду появится текст "Delayed text".