基于TypeScript接口构建Payload遇类型错误，求解决方案

首先明确两个错误的根源：

• 第一个错误：你把单个字符串"Portfolios"赋值给了要求数组类型的assetTypeIds，类型完全不匹配，接口定义的是数组而非单个元素。
• 第二个错误：TypeScript默认会把["Portfolios"]推断为宽泛的string[]类型，而你的接口要求的是更具体的("Portfolios"|"Indexes"|"Reports")[]联合类型数组，因此类型不兼容。

解决方案 #

1. 修正单个字符串赋值的错误

必须传递数组，不能直接传单个字符串，第一个写法要改成：

const payload: SearchFilter = {
  assetTypeIds: ["Portfolios"]
}

2. 修复数组类型推断不匹配的问题

有三种常用方式解决这个类型推断问题：

方式一：使用const断言

通过as const让TypeScript将数组推断为只读的字面量数组，完美匹配接口的类型要求：

const payload: SearchFilter = {
  assetTypeIds: ["Portfolios"] as const
}

方式二：定义类型别名优化代码可读性

先把联合类型抽成别名，TypeScript就能自动推断数组的正确类型：

// 定义资产类型的联合类型别名
type AssetType = "Portfolios" | "Indexes" | "Reports";

// 更新接口定义
export interface SearchFilter{
  assetTypeIds?: AssetType[];
}

// 赋值不再报错
const payload: SearchFilter = {
  assetTypeIds: ["Portfolios"]
}

方式三：显式类型断言

如果不想修改接口，也可以直接断言数组的类型：

const payload: SearchFilter = {
  assetTypeIds: ["Portfolios"] as ("Portfolios"|"Indexes"|"Reports")[]
}

内容的提问来源于stack exchange，提问作者Hernan Humaña