typescript - 尝试将多个 keyof 分配给 Typescript 中的动态描述对象

标签 typescript typescript-typings

这里有一个工作示例来说明我的问题。


interface Definition {
  oneTitle: string
  oneDescription: string
  twoTitle: string
  twoDescription: string
}

const obj = {
  oneTitle: 'Title 1',
  oneDescription: 'Desc 1',
  twoTitle: 'Title 2',
  twoDescription: 'Desc 2'
}

type Keys = 'one' | 'two'

const keys: Keys[] = [
  'one',
  'two'
]

keys.forEach((key) => {
  const {
    [`${key}Title` as keyof Definition]: title,
    [`${key}Description` as keyof Definition]: description,
  } = obj
})

如您所见,有一个动态对象描述,例如。 [`${key}Title`]。我想知道在那种情况下,Typescript 中是否有一种方法可以避免为每个键定义多次 as keyof Definition

我尝试了以下方法但没有成功。

const {
  [`${key}Title`]: title,
  [`${key}Description`]: description,
}: Record<keyof Definition, Definition> = config
const {
  [`${key}Title`]: title,
  [`${key}Description`]: description,
}: {[key in keyof Definition]: Definition} = config

确实,因为我在这两种情况下都遇到了错误 has no matching index signature for type 'string,似乎 Typescript 将动态键解释为字符串而不是定义类型。

感谢您的帮助(:

最佳答案

这不是一个巨大的改进,但如果你在 2 个地方阻止自动类型扩展,你可以删除 as keyof Definition 的需要,尽管代码仍然会有点重复。将 keys 数组声明为 const,这样它就不会扩展为 string[],并将属性访问器 声明为 const 所以它也不会扩展为 string

const keys = [
  'one',
  'two'
] as const;

keys.forEach((key) => {
  const {
    [`${key}Title` as const]: title,
    [`${key}Description` as const]: description,
  } = obj
})

关于typescript - 尝试将多个 keyof 分配给 Typescript 中的动态描述对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67931199/

相关文章:

Typescript:组合类型上不存在属性?

typescript - knockout es5 类型

继承 T 的 typescript 泛型函数

javascript - React + TypeScript : 'React' refers to a UMD global but the current file is a module. 考虑改为添加导入。 (理由)

javascript - Angular 2+ 加载整个模块还是只加载导出的组件?

typescript - 使用 TypeScript 使用 Jest 测试或模拟未导出的函数

javascript - 类型 '(priority1: number, priority2: number) => number' 的参数不可分配给类型 '(a: unknown, b: unknown) => number' 的参数

javascript - window.onload 在 Angular 4 中不起作用

Typescript如何删除函数类型的最后一个参数?

typescript - 如何使用 typescript 中的查找来推断类型化的 mapValues?