如何在TypeScript中为嵌套对象使用索引签名？

你遇到的错误根源是：你定义的索引签名{[key: string]: string}强制所有属性值都为string类型，但address是一个嵌套对象，TypeScript会判定data.address为string，自然找不到country属性。以下是无需硬编码接口的解决方法：

1. 递归索引类型（推荐） #

定义一个递归类型，允许属性值为基础类型或同结构的嵌套对象，适配任意层级的嵌套场景：

// 支持string、number和嵌套对象的递归类型
type NestedObject = {
  [key: string]: string | number | NestedObject;
};

// 组件参数使用该类型
const DataCell = (data: NestedObject) => {
  // 通过类型断言明确address是嵌套对象类型
  return <span>{(data.address as NestedObject).country}</span>;
};

2. 带类型守卫的安全访问 #

如果需要更严谨的类型检查，避免类型断言，可以用类型守卫确保访问的属性是对象：

type NestedObject = {
  [key: string]: string | number | NestedObject;
};

const DataCell = (data: NestedObject) => {
  // 检查address是否为非空对象
  if (typeof data.address === 'object' && data.address !== null) {
    return <span>{data.address.country}</span>;
  }
  // 处理address不存在或不是对象的边界情况
  return <span>暂无地址信息</span>;
};

3. 宽松的任意嵌套类型（适合快速原型） #

如果不需要严格的基础类型限制，可以直接定义值为任意类型的嵌套结构：

type LooseNestedObject = {
  [key: string]: any;
};

const DataCell = (data: LooseNestedObject) => {
  return <span>{data.address.country}</span>;
};

注意：这种方式会完全失去TypeScript的类型检查能力，仅适合快速开发场景。

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