瀏覽代碼

在TopoDetail组件中添加handleRefreshAlarm函数,使用useMemoizedFn避免闭包陷阱,并在组件挂载时添加事件监听器以处理刷新事件。

valentichu 8 月之前
父節點
當前提交
8d77f7a2f4
共有 2 個文件被更改,包括 17 次插入0 次删除
  1. 0 0
      lib/index.js
  2. 17 0
      src/pages/Alarm/components/topoDetail.jsx

File diff suppressed because it is too large
+ 0 - 0
lib/index.js


+ 17 - 0
src/pages/Alarm/components/topoDetail.jsx

@@ -8,6 +8,7 @@ import dayjs from "dayjs";
 import _ from "lodash";
 import API from "../../../api/alarm";
 import classNames from "classnames";
+import { useMemoizedFn } from "ahooks";
 
 const { RangePicker } = DatePicker;
 
@@ -238,6 +239,22 @@ const TopoDetail = (props) => {
     }
   }, [id]);
 
+  // 使用useMemoizedFn避免闭包陷阱
+  const handleRefreshAlarm = useMemoizedFn(() => {
+    fetchAlarmDetail(id, range[0], range[1]);
+  });
+
+  // 监听刷新事件
+  useEffect(() => {
+    // 添加事件监听器
+    window.addEventListener("refreshAlarm", handleRefreshAlarm);
+
+    // 清理函数:移除事件监听器
+    return () => {
+      window.removeEventListener("refreshAlarm", handleRefreshAlarm);
+    };
+  }, []);
+
   // 获取告警详情
   const fetchAlarmDetail = async (alarmId, startTime, endTime) => {
     try {

Some files were not shown because too many files changed in this diff