From 0dc1befe381efc87ea3394822d92015612c16828 Mon Sep 17 00:00:00 2001
From: dyh_a <xinzon32177@163.com>
Date: Tue, 29 Aug 2023 00:14:20 +0800
Subject: [PATCH] =?UTF-8?q?feat(shared):=20=E6=96=B0=E5=A2=9E=20useStateWi?=
 =?UTF-8?q?thTrailClear=20=E5=B8=A6=E5=B0=BE=E9=83=A8=E8=87=AA=E5=8A=A8?=
 =?UTF-8?q?=E6=B8=85=E7=90=86=E7=9A=84=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/shared/src/hooks/index.ts            |  1 +
 .../src/hooks/useStateWithTrailClear.ts       | 25 +++++++++++++++++++
 2 files changed, 26 insertions(+)
 create mode 100644 packages/shared/src/hooks/useStateWithTrailClear.ts

diff --git a/packages/shared/src/hooks/index.ts b/packages/shared/src/hooks/index.ts
index 686d2442..8ac636a2 100644
--- a/packages/shared/src/hooks/index.ts
+++ b/packages/shared/src/hooks/index.ts
@@ -11,3 +11,4 @@ export * from './useAppendTo';
 export * from './useScrollLock';
 export * from './useNextEffect';
 export * from './useIsChanged';
+export * from './useStateWithTrailClear';
diff --git a/packages/shared/src/hooks/useStateWithTrailClear.ts b/packages/shared/src/hooks/useStateWithTrailClear.ts
new file mode 100644
index 00000000..4b2d5d6e
--- /dev/null
+++ b/packages/shared/src/hooks/useStateWithTrailClear.ts
@@ -0,0 +1,25 @@
+import React, { useEffect, useState } from 'react';
+
+/**
+ * 带后续清理的状态
+ *
+ * 每当设置一个值，下一次 Effect 就会把它重置为 undefined，
+ * 也就是说会触发 3 次 effect：
+ * 1. 外部依赖状态更新
+ * 2. 依据外部状态更新内部状态
+ * 3. 内部状态恢复为 undefined
+ *
+ * 类似电子打火机的点火装置，点着了气体之后接下来就与点火器无关且可以关掉了。
+ */
+export function useStateWithTrailClear<T>(
+  visible: T | undefined,
+): ReturnType<typeof React.useState<T>> {
+  const [state, setState] = useState<typeof visible>();
+
+  useEffect(() => {
+    state !== undefined && setState(undefined);
+  }, [state]);
+  useEffect(() => setState(visible), [visible]);
+
+  return [state, setState];
+}