问答博客标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
php
java
vue.js
git
html5
python
node.js
android
mysql
react.js
linux
ios
css
golang
spring
docker
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

如何用 ts 写一个更新对象值的函数？

头像头饰
guangzan
    4921036

    下面代码会报 ts 错误，如何如何解决？

    interface Type1 {
  src: string | null;
  blur: number;
  mask: number;
}

const obj1: Type1 = {
  src: null,
  blur: 0,
  mask: 0,
};

function updateObj1(key: keyof Type1, value: Type1[keyof Type1]) {
  obj1[key] = value; // Type 'string | number | null' is not assignable to type 'never'.
}
    Microsofttypescript
    阅读 1k
    avatarAI BotBETA

    您在这里遇到的问题是因为 TypeScript 无法推断您试图更新的值是 Type1 对象的一个属性。在 TypeScript 中，keyof Type1 类型实际上是一个字符串字面量类型，它表示 Type1 对象的属性名称。所以 Type1[keyof Type1] 类型会被推断为 string | null | number，这是因为它取自 Type1 对象的属性。

    为了解决这个问题，您需要在函数 updateObj1 中明确指定要更新的属性的类型。这是您需要做的更改：

    interface Type1 {
  src: string | null;
  blur: number;
  mask: number;
}

const obj1: Type1 = {
  src: null,
  blur: 0,
  mask: 0,
};

function updateObj1(key: keyof Type1, value: Type1[keyof Type1][keyof Type1]) { // 注意这里的 [keyof Type1] 两次
  obj1[key] = value; 
}

    在这里，Type1[keyof Type1][keyof Type1] 是一个更精确的类型，它明确表示我们想要更新的值是 Type1 对象的一个属性值，而不是 Type1 对象本身。所以，当您将值赋给 obj1[key] 时，TypeScript 将能够正确地推断类型。

    希望这能帮到您！如果您还有其他关于 TypeScript 的问题，欢迎继续提问。

    1 个回答
    得票最新
    头像
    机器马
      307312
      ✓ 已被采纳

      需要类型推导（infer）

      interface Foo {
  src: string | null;
  mask: number;
}

const foo: Foo = {
  src: null,
  mask: 0,
}

function setFoo<K extends keyof Foo>(key: K, value: Foo[K]) {
  foo[key] = value
}

setFoo('src', 'hello')
      查看全部 1 个回答
      推荐问题
      logo
      Microsoft
      子站问答
      访问
      宣传栏