diff --git a/docs/useDebounce.md b/docs/useDebounce.md
index 20a25b27e6..4dc06b324b 100644
--- a/docs/useDebounce.md
+++ b/docs/useDebounce.md
@@ -45,5 +45,5 @@ const Demo = () => {
 ## Reference
 
 ```ts
-useDebounce(fn, ms: number, args: any[]);
+const { cancel } = useDebounce(fn, ms: number, args: any[]);
 ```
diff --git a/src/useDebounce.ts b/src/useDebounce.ts
index 3c7d4664ca..eded395d30 100644
--- a/src/useDebounce.ts
+++ b/src/useDebounce.ts
@@ -1,14 +1,27 @@
+import { useCallback, useRef } from 'react';
 import useUpdateEffect from './useUpdateEffect';
 
+
 const useDebounce = (fn: () => any, ms: number = 0, args: any[] = []) => {
+
+  const timer = useRef<number>();
+
   useUpdateEffect(() => {
-    const handle = setTimeout(fn.bind(null, args), ms);
 
+    timer.current = window.setTimeout(fn.bind(null, args), ms);
     return () => {
       // if args change then clear timeout
-      clearTimeout(handle);
+      window.clearTimeout(timer.current);
     };
   }, args);
+
+  const cancel = useCallback(() => {
+    if (timer.current) {
+      window.clearTimeout(timer.current);
+    }
+  }, []);
+
+  return { cancel };
 };
 
 export default useDebounce;
diff --git a/src/useUpdateEffect.ts b/src/useUpdateEffect.ts
index 47678266bc..63fbc80c66 100644
--- a/src/useUpdateEffect.ts
+++ b/src/useUpdateEffect.ts
@@ -7,7 +7,7 @@ const useUpdateEffect: typeof useEffect = (effect, deps) => {
     if (isInitialMount.current) {
       isInitialMount.current = false;
     } else {
-      effect();
+      return effect();
     }
   }, deps);
 };