Util - Ant Design — ContextQMD

自 5.13.0 版本开始提供这些方法。

GetRef

获取组件的 ref 属性定义，这对于未直接暴露或者子组件的 ref 属性定义非常有用。

tsx

import { Select } from 'antd';
import type { GetRef } from 'antd';

type SelectRefType = GetRef<typeof Select>; // BaseSelectRef

GetProps

获取组件的 props 属性定义：

tsx

import { Checkbox } from 'antd';
import type { GetProps } from 'antd';

type CheckboxGroupType = GetProps<typeof Checkbox.Group>;

同时也支持获取 Context 的属性定义：

tsx

import type { GetProps } from 'antd';

interface InternalContextProps {
  name: string;
}

const Context = React.createContext<InternalContextProps>({ name: 'Ant Design' });

type ContextType = GetProps<typeof Context>; // InternalContextProps

GetProp

获取组件的单个 props 或者 context 属性定义。它已经将 NonNullable 进行了封装，所以不用再考虑为空的情况：

tsx

import { Select } from 'antd';
import type { GetProp, SelectProps } from 'antd';

// 以下两种都可以生效
type SelectOptionType1 = GetProp<SelectProps, 'options'>[number];
type SelectOptionType2 = GetProp<typeof Select, 'options'>[number];
type ContextOptionType = GetProp<typeof Context, 'name'>;