From 99ac4780d64fd26dedf29f9caa9b0ca9b30480f4 Mon Sep 17 00:00:00 2001 From: tangjinzhou <415800467@qq.com> Date: Mon, 9 Aug 2021 17:03:36 +0800 Subject: [PATCH] perf: ts type perf --- components/date-picker/date-fns.tsx | 13 +++--- components/date-picker/dayjs.tsx | 13 +++--- .../generatePicker/generateSinglePicker.tsx | 18 +++++++- .../date-picker/generatePicker/index.tsx | 43 ++++++++++--------- components/date-picker/moment.tsx | 13 +++--- 5 files changed, 63 insertions(+), 37 deletions(-) diff --git a/components/date-picker/date-fns.tsx b/components/date-picker/date-fns.tsx index f7e6c3cc2..8023a8ab7 100755 --- a/components/date-picker/date-fns.tsx +++ b/components/date-picker/date-fns.tsx @@ -13,12 +13,15 @@ export type MonthPickerProps = Omit, 'picker'> & ExtraDate export type WeekPickerProps = Omit, 'picker'> & ExtraDatePickerProps; export type RangePickerProps = BaseRangePickerProps & ExtraRangePickerProps; -const DatePicker = generatePicker(dataFnsGenerateConfig); +const { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker, RangePicker } = + generatePicker(dataFnsGenerateConfig); -const RangePicker = DatePicker.RangePicker; -const MonthPicker = DatePicker.MonthPicker; -const WeekPicker = DatePicker.WeekPicker; -const QuarterPicker = DatePicker.QuarterPicker; +DatePicker.WeekPicker = WeekPicker; +DatePicker.MonthPicker = MonthPicker; +DatePicker.YearPicker = YearPicker; +DatePicker.RangePicker = RangePicker; +DatePicker.TimePicker = TimePicker; +DatePicker.QuarterPicker = QuarterPicker; /* istanbul ignore next */ DatePicker.install = function (app: App) { diff --git a/components/date-picker/dayjs.tsx b/components/date-picker/dayjs.tsx index 44cefca2e..e977b0f19 100755 --- a/components/date-picker/dayjs.tsx +++ b/components/date-picker/dayjs.tsx @@ -14,12 +14,15 @@ export type MonthPickerProps = Omit, 'picker'> & ExtraDat export type WeekPickerProps = Omit, 'picker'> & ExtraDatePickerProps; export type RangePickerProps = BaseRangePickerProps & ExtraRangePickerProps; -const DatePicker = generatePicker(dayjsGenerateConfig); +const { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker, RangePicker } = + generatePicker(dayjsGenerateConfig); -const RangePicker = DatePicker.RangePicker; -const MonthPicker = DatePicker.MonthPicker; -const WeekPicker = DatePicker.WeekPicker; -const QuarterPicker = DatePicker.QuarterPicker; +DatePicker.WeekPicker = WeekPicker; +DatePicker.MonthPicker = MonthPicker; +DatePicker.YearPicker = YearPicker; +DatePicker.RangePicker = RangePicker; +DatePicker.TimePicker = TimePicker; +DatePicker.QuarterPicker = QuarterPicker; /* istanbul ignore next */ DatePicker.install = function (app: App) { diff --git a/components/date-picker/generatePicker/generateSinglePicker.tsx b/components/date-picker/generatePicker/generateSinglePicker.tsx index 0d542755e..c80f3ec4e 100644 --- a/components/date-picker/generatePicker/generateSinglePicker.tsx +++ b/components/date-picker/generatePicker/generateSinglePicker.tsx @@ -17,7 +17,7 @@ import type { ExtraDatePickerProps } from './props'; import { commonProps, datePickerProps } from './props'; import devWarning from '../../vc-util/devWarning'; -export default function generatePicker( +export default function generateSinglePicker( generateConfig: GenerateConfig, extraProps: Record = {}, ) { @@ -238,5 +238,19 @@ export default function generatePicker( 'AQuarterPicker', ); - return { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker }; + return { + DatePicker, + WeekPicker, + MonthPicker, + YearPicker, + TimePicker, + QuarterPicker, + } as unknown as { + DatePicker: DefineComponent; + WeekPicker: DefineComponent, 'picker'>>; + MonthPicker: DefineComponent, 'picker'>>; + YearPicker: DefineComponent, 'picker'>>; + TimePicker: DefineComponent, 'picker'>>; + QuarterPicker: DefineComponent, 'picker'>>; + }; } diff --git a/components/date-picker/generatePicker/index.tsx b/components/date-picker/generatePicker/index.tsx index 706ecc9bb..089b63963 100644 --- a/components/date-picker/generatePicker/index.tsx +++ b/components/date-picker/generatePicker/index.tsx @@ -17,6 +17,8 @@ import type { TimePickerLocale } from '../../time-picker'; import generateSinglePicker from './generateSinglePicker'; import generateRangePicker from './generateRangePicker'; import type { SizeType } from '../../config-provider'; +import type { ExtraDatePickerProps, ExtraRangePickerProps } from './props'; +import type { DefineComponent } from 'vue'; export const Components = { button: PickerButton, rangeItem: PickerTag }; @@ -129,32 +131,33 @@ function generatePicker( generateConfig: GenerateConfig, extraProps: Record = {}, ) { + type DatePickerProps = PickerProps & ExtraDatePickerProps; // =========================== Picker =========================== const { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker } = - generateSinglePicker(generateConfig, extraProps); + generateSinglePicker(generateConfig, extraProps); // ======================== Range Picker ======================== - const RangePicker = generateRangePicker(generateConfig, extraProps); + const RangePicker = generateRangePicker(generateConfig, extraProps); - // =========================== Export =========================== - type MergedDatePickerType = typeof DatePicker & { - WeekPicker: typeof WeekPicker; - MonthPicker: typeof MonthPicker; - YearPicker: typeof YearPicker; - RangePicker: typeof RangePicker; - TimePicker: typeof TimePicker; - QuarterPicker: typeof QuarterPicker; + // 类型过于复杂，使用 as 避免 TS7056 错误 + // error TS7056: The inferred type of this node exceeds the maximum length the compiler will serialize. An explicit type annotation is needed. + return { + DatePicker, + WeekPicker, + MonthPicker, + YearPicker, + TimePicker, + QuarterPicker, + RangePicker, + } as unknown as { + DatePicker: DefineComponent; + WeekPicker: DefineComponent, 'picker'>>; + MonthPicker: DefineComponent, 'picker'>>; + YearPicker: DefineComponent, 'picker'>>; + TimePicker: DefineComponent, 'picker'>>; + QuarterPicker: DefineComponent, 'picker'>>; + RangePicker: DefineComponent & ExtraRangePickerProps>; }; - - const MergedDatePicker = DatePicker as MergedDatePickerType; - MergedDatePicker.WeekPicker = WeekPicker; - MergedDatePicker.MonthPicker = MonthPicker; - MergedDatePicker.YearPicker = YearPicker; - MergedDatePicker.RangePicker = RangePicker; - MergedDatePicker.TimePicker = TimePicker; - MergedDatePicker.QuarterPicker = QuarterPicker; - - return MergedDatePicker; } export default generatePicker; diff --git a/components/date-picker/moment.tsx b/components/date-picker/moment.tsx index 2141f11b9..1c902ad3c 100755 --- a/components/date-picker/moment.tsx +++ b/components/date-picker/moment.tsx @@ -16,12 +16,15 @@ export type WeekPickerProps = Omit, 'picker'> & ExtraDatePickerProps; export type RangePickerProps = BaseRangePickerProps & ExtraRangePickerProps; -const DatePicker = generatePicker(momentGenerateConfig); +const { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker, RangePicker } = + generatePicker(momentGenerateConfig); -const RangePicker = DatePicker.RangePicker; -const MonthPicker = DatePicker.MonthPicker; -const WeekPicker = DatePicker.WeekPicker; -const QuarterPicker = DatePicker.QuarterPicker; +DatePicker.WeekPicker = WeekPicker; +DatePicker.MonthPicker = MonthPicker; +DatePicker.YearPicker = YearPicker; +DatePicker.RangePicker = RangePicker; +DatePicker.TimePicker = TimePicker; +DatePicker.QuarterPicker = QuarterPicker; /* istanbul ignore next */ DatePicker.install = function (app: App) {