TS实现Optional typescript 函数推算非必填项

最新推荐文章于 2024-08-30 07:59:23 发布

故梦梦

最新推荐文章于 2024-08-30 07:59:23 发布

阅读量3.7k

点赞数 3

文章标签： typescript vue react

本文链接：https://blog.csdn.net/qq_42704945/article/details/131476411

版权

文章介绍了如何使用TypeScript的Omit,Pick和Partial工具类型来简化和优化复杂接口的定义，特别是在处理可选字段时。通过示例展示了如何创建一个可选参数的ContractParams类型，从而避免重复代码和提高代码的可维护性。

摘要由CSDN通过智能技术生成

typescript实现类型推算

在代码中我们需要实现condition和examineState这两个类型可填，我们也可以通过这种方式去实现
但是在字段很多而且在应用场景很多的时候这样写很麻烦也可能你这个地方需要必填另外一个地方不需要必填这样就造成了全局很多的重复代码。而且也不便于维护。

export type ContractParams = {
  current: number;
  pageSize: number;
  phone: string;
  condition?: string;
  examineState?: string;
};

我们可以通过Omit<T,K>通过传入参数去剔除我们非必填项，然后通过Pick选取提出的非必填项在使用typeScript的partial函数变成非必填然后使用&把两个type合并成一个。这样的函数在全局就可以直接使用也不会造成重复的typeScript代码。

export type ContractParams = {
  current: number;
  pageSize: number;
  phone: string;
  condition: string;
  examineState: string;
};

type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
export type ContractIteme = Optional<ContractParams, 'condition'>;