我试图动态更新一个对象的选项属性从一个对象.在代码中,我得到一个错误,它说axiosOptions.headers[key](我在下面的代码示例中留下了注释).

TypeScript Error

Type 'string | undefined' is not assignable to type '"true" | "false"'.
  Type 'undefined' is not assignable to type '"true" | "false"'.

My Code

type ApiHeaders = {
  Accept: string;
  'Content-Type': string;
  IsRequireAdmin: 'true' | 'false';
  Authorization?: string;
  BarCode?: string;
  DomainName?: string;
};

interface AxiosOptions {
  params?: any;
  data?: any;
  headers: ApiHeaders;
}

const axiosOptions: AxiosOptions = {
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
    IsRequireAdmin: 'false'
  }
};

const updateAxiosOptionsHeaders = (newApiHeaders: Partial<ApiHeaders>): void => {
  let key: keyof Partial<ApiHeaders>;
  for (key in newApiHeaders) axiosOptions.headers[key] = newApiHeaders[key]; // <----------- typescript error
};

const token: string = 'my_token';
const barCode: string = 'my_bar_code';
const domainName: string = 'www.mydomain.com';

const newApiHeaders: Omit<ApiHeaders, 'Content-Type' | 'Accept'> = {
  'IsRequireAdmin': 'true',
  'Authorization': `Bearer ${token}`,
  'BarCode': barCode,
  'DomainName': `DATA\\${domainName}`
  };

updateAxiosOptionsHeaders(newApiHeaders);

我对如何解决这个问题的建议持开放态度.

推荐答案

TypeScript不知道它不知道什么.它不知道在任何给定的updateAxiosOptionsHeaders运行中key将是什么,所以它 Select 最严格的可能解释.当然,有很多不同的方法来解决这个问题,但是如果你想保持类型不变,你可以在函数中解决它:

type ApiHeaders = {
  Accept: string;
  'Content-Type': string;
  IsRequireAdmin: 'true' | 'false';
  Authorization?: string;
  BarCode?: string;
  DomainName?: string;
};

interface AxiosOptions {
  params?: any;
  data?: any;
  headers: ApiHeaders;
}

const axiosOptions: AxiosOptions = {
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
    IsRequireAdmin: 'false'
  }
};

const updateAxiosOptionsHeaders = (newApiHeaders: Partial<ApiHeaders>): void => {
  let key: keyof Partial<ApiHeaders>;
  for (key in newApiHeaders) {
    if (key === 'IsRequireAdmin') {
        // Note the default value if one isn't provided in newApiHeaders for some reason
        axiosOptions.headers.IsRequireAdmin = newApiHeaders.IsRequireAdmin ?? 'false';
    } else {
        // ditto here
        axiosOptions.headers[key] = newApiHeaders[key] ?? '';
    } 
  }
};
const token: string = 'my_token';
const barCode: string = 'my_bar_code';
const domainName: string = 'www.mydomain.com';

const newApiHeaders: Partial<ApiHeaders> = {
  'IsRequireAdmin': 'true',
  'Authorization': `Bearer ${token}`,
  'BarCode': barCode,
  'DomainName': `DATA\\${domainName}`
  };

updateAxiosOptionsHeaders(newApiHeaders);

查看更改部分的注释;您需要决定合理的缺省值.

Typescript相关问答推荐

您可以创建一个类型来表示打字员吗

如何在函数参数中使用(或模仿)`success`的行为?

类型脚本泛型最初推断然后设置

如何修复正在处理类型但与函数一起使用时不处理的类型脚本类型

如何正确地对类型脚本泛型进行限制

根据上一个参数值查找参数类型,也返回类型

如何在单击停止录制按钮后停用摄像机?(使用React.js和Reaction-Media-Recorder)

如何在TypeScript中将一个元组映射(转换)到另一个元组?

如何在Type脚本中动态扩展函数的参数类型?

诡异的文字类型--S为物语的关键

在Reaction-Native-ReAnimated中不存在Animated.Value

如何将别名添加到vitest配置文件?

根据类型脚本中的泛型属性 Select 类型

我可以使用typeof来强制执行某些字符串吗

TypeScrip:使用Union ToInterval辅助对象,但保留子表达式

是否将Angular *ngFor和*ngIf迁移到新的v17语法?

如何提取具有索引签名的类型中定义的键

基于参数的 TS 返回类型

如何在 ngFor 循环中以Angular 正确动态渲染组件

是否有解释为什么默认情况下在泛型类型上访问的属性不是索引访问