Antd Pro Table数据源类型冲突：固定与动态键兼容方案求助

问题原因 #

你定义的SummaryData将固定结构类型与Record<string, number | string | null>做交叉合并，导致TypeScript强制要求所有字符串键（包括subcontractor、docfile这类固定键）的类型都必须匹配number | string | null。但docfile等固定键是对象类型，和索引签名要求的类型不兼容，因此报错。

解决方案 #

通过限定索引签名仅作用于非固定键，避免固定键的类型被覆盖。修改SummaryData的类型定义如下：

export type DataSourceBaseColumns = {
  subcontractor: MasterAgent | null
  supplier: MasterAgent | null
  product_template: {
    id: number | null
    name: string | null
  } | null
  docfile: {
    order_document_id: string | null
    document_id: number | null
    name: string | null
    url: string | null
  } | null
}

// 修改后的SummaryData
export type SummaryData = DataSourceBaseColumns & { uuid: string } & {
  // 仅对固定键和uuid之外的字符串键应用索引签名
  [K in Exclude<string, keyof DataSourceBaseColumns | 'uuid'>]: number | string | null;
}

const columns: ProColumns<SummaryData>[] = data.columns.map(
  (column) => ({
    title: column,
    dataIndex: column,
    align: 'left',
    // 如果列包含固定键（如docfile），需要自定义render来解析对象内容
    render: (text) => {
      if (column === 'docfile' && text) {
        return <a href={text.url}>{text.name}</a>;
      }
      // 其他固定键或动态键的渲染逻辑
      return text;
    }
  })
);

补充说明 #

• Exclude<string, keyof DataSourceBaseColumns | 'uuid'>用于筛选出所有不属于固定键和uuid的字符串键，保证索引签名只影响动态生成的后端字段。
• 如果后端返回的动态键是可选字段，可以将索引签名改为Partial包裹，即Partial<{ [K in ...]: ... }>，允许动态键不存在。
• 若data.columns包含docfile这类对象类型的固定键，需要在列配置中添加render函数解析对象内容，否则ProTable无法直接渲染对象。

内容的提问来源于stack exchange，提问作者Matgorn