Просмотр исходного кода

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

valentichu 7 месяцев назад
Родитель
Сommit
8d77f7a2f4
2 измененных файлов с 17 добавлено и 0 удалено
  1. 0 0
      lib/index.js
  2. 17 0
      src/pages/Alarm/components/topoDetail.jsx

Разница между файлами не показана из-за своего большого размера
+ 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 {

Некоторые файлы не были показаны из-за большого количества измененных файлов