diff --git a/src/hooks/useEvent.ts b/src/hooks/useEvent.ts
index f9bb7dce..4c6f92a0 100644
--- a/src/hooks/useEvent.ts
+++ b/src/hooks/useEvent.ts
@@ -2,12 +2,18 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import * as React from 'react';
 
-function useEvent<T extends Function>(callback: T): T {
-  const fnRef = React.useRef<any>();
+function useEvent<T extends ((...args: any[]) => any) | undefined>(
+  callback: T,
+): undefined extends T
+  ? (
+      ...args: Parameters<NonNullable<T>>
+    ) => ReturnType<NonNullable<T>> | undefined
+  : T {
+  const fnRef = React.useRef<T | undefined>(callback);
   fnRef.current = callback;
 
-  const memoFn = React.useCallback<T>(
-    ((...args: any) => fnRef.current?.(...args)) as any,
+  const memoFn = React.useCallback(
+    (...args: any[]) => fnRef.current?.(...args),
     [],
   );
 
diff --git a/tests/hooks.test.tsx b/tests/hooks.test.tsx
index b8154c66..fc096500 100644
--- a/tests/hooks.test.tsx
+++ b/tests/hooks.test.tsx
@@ -9,6 +9,7 @@ import useMobile from '../src/hooks/useMobile';
 import useState from '../src/hooks/useState';
 import useSyncState from '../src/hooks/useSyncState';
 import useControlledState from '../src/hooks/useControlledState';
+import useEvent from '../src/hooks/useEvent';
 
 global.disableUseId = false;
 
@@ -706,4 +707,23 @@ describe('hooks', () => {
       expect(container.textContent).toEqual('2');
     });
   });
+
+  describe('useEvent', () => {
+    it('extract type', () => {
+      const Demo = (props: {
+        canUndefined?: (a: number) => boolean;
+        notUndefined: (a: number) => boolean;
+      }) => {
+        const ua = useEvent(props.canUndefined);
+        const ub = useEvent(props.notUndefined);
+
+        ua(1);
+        ub(2);
+
+        return null;
+      };
+
+      expect(Demo).toBeTruthy();
+    });
+  });
 });