編輯
感謝@jsejcksn,我想我解決了這個問題:TS Playground
我正在構建一個函式來幫助我將媒體查詢與 tailwind 庫一起使用。該庫有一些預定義命名斷點喜歡xs,lg等等。但是我也想確定自己命名的斷點喜歡mobile,desktop等等。
所以我創建了兩個“不同”的功能:
interface AppBreakpointQuery {
breakpoint: 'mobile' | 'tablet' | 'notebook' | 'desktop';
query: string;
}
interface TailwindBreakpointQuery {
breakpoint: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
query: string;
}
const tailwindBreakpoints: TailwindBreakpointQuery[] = [
{ breakpoint: 'xs', query: '(min-width: 640px)' },
{ breakpoint: 'sm', query: '(min-width: 768px)' },
{ breakpoint: 'md', query: '(min-width: 1024px)' },
{ breakpoint: 'lg', query: '(min-width: 1280px)' },
{ breakpoint: 'xl', query: '(min-width: 1536px)' },
];
const appBreakpoints: AppBreakpointQuery[] = [
{ breakpoint: 'mobile', query: '(min-width: 340px)' },
{ breakpoint: 'tablet', query: '(min-width: 500px)' },
{ breakpoint: 'notebook', query: '(min-width: 1024px)' },
{ breakpoint: 'desktop', query: '(min-width: 1280px)' },
];
type TailwindBreakpointValue<T> = {
[key in TailwindBreakpointQuery['breakpoint']]: T;
};
type AppBreakpointValue<T> = {
[key in AppBreakpointQuery['breakpoint']]: T;
};
function useAppBreakpoint<T>(initialValue: T, value: AppBreakpointValue<T>): T;
function useTailwindBreakpoint<T>(initialValue: T, value: TailwindBreakpointValue<T>): T;
這里最大的問題是這些函式具有完全相同的實作。
我想知道是否可以在不重復代碼的情況下僅匯出一個具有不同名稱和引數(useAppBreakpoint和useTailwindBreakpoint)的函式。
另一個簡化的例子:
給定一個add添加它的引數的函式,例如
function add(a: any, b: any) { return a b }
如何匯出與addOne和相同的功能addTwo。就像是:
type One = 1
type Two = 2
function addOne(a: string, b: One): number;
function addTwo(a: number, b: Two): number;
export {
add as addOne,
add as addTwo,
}
這里的想法是addOne === addTwo應該是true
uj5u.com熱心網友回復:
使用您的附加示例:
TS游樂場
function add (a: any, b: any): number {
return a b;
}
type One = 1
type Two = 2
type AddOne = (a: string, b: One) => number;
type AddTwo = (a: number, b: Two) => number;
export const addOne: AddOne = add;
export const addTwo: AddTwo = add;
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/405750.html
標籤:
