typescript - 如何在打字稿中定义接口类型？

Question

我想编写一个函数来修改具有特定接口的表单的值。然后我得到字符串不是表单界面键的一部分的错误。如何为该函数定义类型？为什么我不能使用接口作为类型？

沙盒

interface IForm {
   age: number
   name: string
   job: string
}

// ts 错误：无法将字符串分配给“年龄” | “名字” | “工作”

const setCustom = value => setValue(value, "")

//没有ts错误

const setCustom: (value: "age" | "name" | "job") => void = value => setValue(value, "")

标签： typescriptreact-hook-form

Answer 1

您似乎正在寻找keyof类型运算符，它采用对象类型IForm并生成其键的联合：

type KeyofIform = keyof IForm;
// type KeyofIform = "age" | "name" | "job"

因此，在您手动指定的任何地方，您都"age" | "name" | "job"可以改用keyof IForm，这是等效的，如果IForm' 的定义发生更改，它将自动更改：

const setCustom: (value: keyof IForm) => void = value => setValue(value, "")
// const setCustom: (value: keyof IForm) => void

setCustom("age"); // okay
setCustom("name"); // okay
setCustom("job"); // okay
setCustom("shoeSize"); // error!
// Argument of type '"shoeSize"' is not assignable 
// to parameter of type '"age" | "name" | "job"'

Playground 代码链接