首页 > 解决方案 > 警报自动消失功能

问题描述

我的目标是让用户在不点击任何按钮的情况下在我的页面开始时看到警报。一段时间后它应该会自动消失我正在 reactjs 上尝试这个所以任何机构都可以帮助我找到我应该应用哪个逻辑

标签: 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>;
};

推荐阅读