Блог

Моя цель состоит в том, чтобы дать пользователю увидеть предупреждение при запуске моей страницы без нажатия какой-либо кнопки.И через некоторое время это должно исчезнуть автоматически я пытаюсь сделать это на reactjs, поэтому любое тело поможет мне найти, какую логику я должен применить

Сначала отрисовайте свой компонент оповещения. Определите логическую переменную состояния с начальным значением false.

затем обновите эту переменную состояния с помощью параметра setTimeout.

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

export const Alert = () => {
  const [timeIsUp, setTimeIsUp] = useState(false);

  useEffect(() => {
    setTimeout(() => {
      setTimeIsUp(true);
    }, 5000);
  }, []);

  if (timeIsUp) {
    return null;
  }

  return <div>your actual alert component content</div>;
};
 

Вы используете class components или functional components для рендеринга своей страницы реакции?

То , что вы ищете, называется life cycles , я настоятельно рекомендую вам заглянуть в документы жизненного цикла ReactJS.

Метод жизненного цикла, который выполняет или выполняет что-то при загрузке страницы, имеет два применения:

Если вы используете class components собственный метод , который вы можете вызвать внутри своего компонента ComponentDidMount() , его использование доступно в документах здесь.

Теперь, если вы используете functional components , вам нужно взглянуть useEffect на крючки React.

После этого вы можете взглянуть на setTimeout собственный метод, javascript как наблюдалось.

Надеюсь, это тоже поможет!

Вы можете перейти по этой ссылке: пользовательский-модальный-всплывающий-компонент

Также просто сделайте состояние модального истинным в fist и добавьте значение setTimeout в useEffect и сделайте его ложным через желаемое время.