如何从接口中函数的参数提取类型来定义新属性？

要让自定义接口的rootProp属性类型与UseAutocompleteReturnValue中getRootProps方法的externalProps参数类型保持一致，可以借助TypeScript的Parameters工具类型自动提取该参数的类型，具体实现如下：

1. 提取目标参数类型 #

用Parameters工具类型获取getRootProps方法的参数元组，再通过索引[0]取出第一个参数的类型：

// 提取getRootProps的externalProps参数类型
type GetRootPropsExternalProps = Parameters<UseAutocompleteReturnValue['getRootProps']>[0];

2. 在自定义接口中使用该类型 #

将提取出的类型赋值给自定义接口的rootProp属性：

interface MyCustomInterface {
  rootProp: GetRootPropsExternalProps;
  // 其他自定义属性...
}

简化写法 #

如果不需要复用提取的类型，也可以直接在接口内嵌套类型提取逻辑：

interface MyCustomInterface {
  rootProp: Parameters<UseAutocompleteReturnValue['getRootProps']>[0];
}

补充说明 #

• 这种写法的核心优势是类型自动同步：如果后续UseAutocompleteReturnValue中getRootProps的参数类型发生变更（比如从any改为更具体的类型），自定义接口的rootProp类型会自动更新，无需手动修改。
• 原参数externalProps是可选参数，因此提取出的类型会包含undefined（即any | undefined）。如果需要rootProp也作为可选属性，可以添加?:修饰符：

  interface MyCustomInterface {
    rootProp?: Parameters<UseAutocompleteReturnValue['getRootProps']>[0];
  }
  

内容的提问来源于stack exchange，提问作者Renaud is Not Bill Gates