时间戳

首页 > 解决方案 > Typescript 中的泛型类型

reactjs - Typescript 中的泛型类型

问题描述

我在理解以下代码时遇到问题redux-form

export type DataSelector<FormData = {}, State = {}> = (formName: string, getFormState?: GetFormState) => (state: State) => FormData;

export const getFormValues: DataSelector;


// mapState
const values = getFormValues("formName")(state) // {}
return { form: values }

IDE 给我values返回的错误{}。这是预期的，因为State = {}. 但是，我想使用访问values.name. 有没有办法通过FormData或State？

标签： reactjstypescriptreduxredux-form

解决方案

const getFormValues: DataSelector{}始终为泛型类型参数设置默认类型FormData，State因为该函数不会将这些参数转发给消费者。

解决涉及第三方库的类型问题的通常方法是：如果您无法控制它，请将其包装。意思是，定义你自己的函数来包装库函数并缩小到所需的项目类型。

// your own types
type MyFormData = { baz: string };
type MyState = {foo: number};

function getFormValuesWrapper(state: MyState): MyFormData {
  return getFormValues("formName")(state) as MyFormData;
}

// or keep it generic
function getFormValuesWrapper2<FormData, State>(state: State){
  return getFormValues("formName")(state) as FormData
}

const values = getFormValuesWrapper(state);
values.baz // (property) baz: string

操场

推荐阅读