Skip to content

Commit

Permalink
feat(question): add #345 - useDebounce
Browse files Browse the repository at this point in the history
  • Loading branch information
murongg committed Jul 7, 2022
1 parent 5bffe68 commit f219d7b
Show file tree
Hide file tree
Showing 5 changed files with 101 additions and 0 deletions.
33 changes: 33 additions & 0 deletions questions/345-usedebounce/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<!--info-header-start-->
<!--info-header-end-->


For this challenge, you need implement a debounce Composable Function. Let's go.

```ts
import type { Ref} from 'vue'

interface UseDebounceOptions {
leading?: boolean // Specify invoking on the leading edge of the timeout.
maxWait?: number // The maximum time func is allowed to be delayed before it's invoked.
trailing?: boolean // Specify invoking on the trailing edge of the timeout.
}

type MaybeRef<T> = T | Ref<T>
type UseDebounce = <T extends (...args: any[]) => any>(fn: T, wait: MaybeRef<number>, options?: UseDebounceOptions) => T

/**
* useDebounce
* @param fn The function to debounce.
* @param wait The number of milliseconds to delay.
* @param options The options object.
* @return Returns the new debounced function.
*/
const useDebounce: UseDebounce = (fn, wait, options) => {
// do someting...
}
```


<!--info-footer-start-->
<!--info-footer-end-->
33 changes: 33 additions & 0 deletions questions/345-usedebounce/README.zh-CN.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<!--info-header-start-->
<!--info-header-end-->


<i>For this challenge, you need implement a debounce Composable Function.</i><b>对于此挑战,您需要实现可访问的可组合功能。</b> <i>Let&#39;s go.</i><b>我们走吧。</b>

``TS
导入类型{ref}从&#39;vue&#39;

接口使用ebounceOptions {
领导?:布尔值//指定在超时的前沿调用。
MaxWait?:NUMBER //允许弹药延迟的最大时间在调用之前被延迟。
尾随?:布尔值//指定在超时的后缘上调用。
}

<i>type MaybeRef</i><b>类型Mayberef</b><T> <i>= T |</i> <b>= t |</b> <i>Ref</i><b>参考</b><T>
<i>type UseDebounce =</i><b>类型使用的bounce =</b><T extends (...args: any[]) => <i>any&gt;(fn: T, wait: MaybeRef</i><b>任何&gt;(fn:t,等等:Mayberef</b><number> <i>, options?: UseDebounceOptions) =&gt; T</i> <b>,选项?:使用了ebouncoptions)=&gt; t</b>

/**
*使用
* @param fn要调试的功能。
* @Param等待毫秒延迟的毫秒数。
* @param选项选项对象。
* @return返回新的拒绝功能。
*/
const usedebounce:undereebounce =(fn,wait,options)=&gt; {
//做一些...
}
````````
<!--info-footer-start-->
<!--info-footer-end-->
7 changes: 7 additions & 0 deletions questions/345-usedebounce/info.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
difficulty: hard
title: useDebounce
tags: Composable Function
author:
github: murongg
name: 木荣

7 changes: 7 additions & 0 deletions questions/345-usedebounce/info.zh-CN.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
difficulty: hard
title: 用过
tags: Composable Function
author:
github: murongg
name: 木荣

21 changes: 21 additions & 0 deletions questions/345-usedebounce/useDebounce.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import type { Ref} from 'vue'

interface UseDebounceOptions {
leading?: boolean // Specify invoking on the leading edge of the timeout.
maxWait?: number // The maximum time func is allowed to be delayed before it's invoked.
trailing?: boolean // Specify invoking on the trailing edge of the timeout.
}

type MaybeRef<T> = T | Ref<T>
type UseDebounce = <T extends (...args: any[]) => any>(fn: T, wait: MaybeRef<number>, options?: UseDebounceOptions) => T

/**
* useDebounce
* @param fn The function to debounce.
* @param wait The number of milliseconds to delay.
* @param options The options object.
* @return Returns the new debounced function.
*/
const useDebounce: UseDebounce = (fn, wait, options) => {
// do someting...
}

0 comments on commit f219d7b

Please sign in to comment.