- 45
- 0
import { DependencyList, useState, useMemo, useRef, useCallback } from 'react';
import useUpdateEffect from '../useUpdateEffect';
import useDebounceFn from '../useDebounceFn';
import useAsync from '../useAsync';
export interface ReturnValue<T> {
loading: boolean;
data?: T;
value: any;
onChange: (value: any) => void;
cancel: () => void;
run: () => void;
}
export interface Options {
wait?: number;
}
function useSearch<Result>(
fn: (value: any) => Promise<Result>,
options?: Options,
): ReturnValue<Result>;
function useSearch<Result>(
fn: (value: any) => Promise<Result>,
deps?: DependencyList,
options?: Options,
): ReturnValue<Result>;
function useSearch<Result>(
fn: (value: any) => Promise<Result>,
deps?: DependencyList | Options,
options?: Options,
): ReturnValue<Result> {
const _deps: DependencyList = (Array.isArray(deps) ? deps : []) as DependencyList;
const _options: Options = (typeof deps === 'object' && !Array.isArray(deps)
? deps
: options || {}) as Options;
const [value, setValue] = useState<any>('');
const { loading, data, run, cancel: cancelAsync } = useAsync<Result>(fn, [value, ..._deps], {
manual: true,
});
const wait: number = useMemo(() => (_options.wait === undefined ? 300 : _options.wait), [
_options.wait,
]);
const debounce = useDebounceFn(
() => {
run(value);
},
[value],
wait,
);
/* 依赖变化时,需要立即重新请求 */
useUpdateEffect(() => {
run(value);
}, _deps);
const cancel = useCallback(() => {
/* 先取消防抖 */
debounce.cancel();
/* 再取消 async */
cancelAsync();
}, [cancelAsync, debounce.cancel]);
/* 手动触发 */
const trigger = useCallback(() => {
run(value);
}, [run, value]);
return {
data,
loading,
value,
onChange: setValue,
cancel,
run: trigger,
};
}
export default useSearch;
截取部分源码 请问这个function useSearch 定义了多次的作用是什么?
- 共 0 条
- 全部回答
-
巨木擎天 普通会员 1楼
在UmiJS(umijs)中,泛型方法(TypeScript interfaces)是一种强大的特性,它允许我们在同一个类定义中使用不同类型的泛型方法,这些方法可以具有相同的名称,但是参数类型和返回类型可能会有所不同。以下是一些同一名称的泛型方法定义在ts中所可能的作用:
- 抽象方法:
- 泛型参数类型:泛型方法接收一个或多个泛型参数,每个泛型参数可以有不同的类型。例如,有一个名为
User的类,其中包含一个名为getName的方法,其类型为string。如果我们想在该类中定义一个名为getUser的方法,该方法的参数类型可以是string或User,例如:
```typescript interface User { getName(): string; }
interface UserOptions { name?: string; }
function getUser(user: UserOptions): User { // 使用默认名称(如果未提供) if (!user.name) { return new User(); }
// 使用提供名称 return new User(user.name); } ```
- 继承方法:
- 泛型参数类型:泛型方法可以继承一个已定义的泛型方法,使其具有相同的名字和参数类型。例如,有一个名为
Person的类,其中包含一个名为getName的方法,其类型为string。如果我们想在该类中定义一个名为getUser的方法,该方法的参数类型可以是string,也可以是Person,例如:
```typescript class Person { getName(): string { return 'John'; }
getUser(user: Person): User { // 使用默认名称(如果未提供) if (!user.getName) { return new Person(); }
// 使用提供名称 return new Person(user.getName);} }
function getUser(user: PersonOptions): User { // 使用提供名称(如果未提供) if (!user.name) { return new Person(); }
// 使用默认名称和提供名称 return new Person(user.name, user); } ```
- 接口:
- 泛型参数类型:泛型方法可以接受一个或多个泛型接口作为参数,这些接口可以有不同的类型。例如,有一个名为
Person的接口,其中包含一个名为getName的方法,其类型为string。如果我们想在该接口中定义一个名为getUser的方法,该方法的参数类型可以是string,也可以是Person,例如:
```typescript interface Person { getName(): string; }
interface PersonOptions extends Person { name?: string; }
function getUser(user: PersonOptions): User { // 使用默认名称(如果未提供) if (!user.name) { return new Person(); }
// 使用提供名称 return new Person(user.name); } ```
- 多态:
- 泛型参数类型:泛型方法可以接受一个或多个泛型参数,并且可以根据这些参数的类型使用不同的代码来调用该方法。例如,有一个名为
Person的类,其中包含一个名为getName的方法,其类型为string。如果我们想在该类中定义一个名为getUser的方法,该方法可以接受两个参数:一个Person对象和一个string类型,我们可以使用以下代码调用getUser方法:
```typescript function getUser(user: Person | PersonOptions, name: string): User { // 检查用户是否为Person对象 if (typeof user === 'object' && user instanceof Person) { return user.getName(); }
// 如果用户未提供名称,则返回默认名称 if (!name) { return new Person(); }
// 使用提供名称 return new Person(name); } ```
这些作用包括:
- 泛型方法定义在同一个类中,可以实现相同的名称和参数类型,但不同的返回类型。
- 泛型方法继承自已定义的泛型方法,使得我们可以在不同类型的类中实现相同的功能,同时也可以继承已有的特性。
- 泛型方法接受接口作为参数,可以让我们在多个类中共享一些通用的代码,而不需要在每个类中都定义相同的方法。
- 泛型方法可以处理不同类型的参数,例如
Person对象和PersonOptions对象,或者可以处理不同类型的数据,例如string和User对象。
总之,同一名称的泛型方法定义在ts中可以实现多种功能,可以减少代码重复,提高代码可维护性和复用性。
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部

