TypeScript中TS18048错误求助：'record.childList1'可能为undefined

问题根源在于childList1是可选属性（带?标记），它本身可能为undefined；同时即使它是数组，数组也可能为空，导致childList1[0]同样是undefined。你之前的两种写法都没覆盖childList1本身为undefined的场景，所以报错依然存在。

可行解决方案 #

1. 完整使用可选链（推荐）

给childList1和数组元素都加上可选链操作符，完整覆盖所有可能的undefined场景：

{record.childList1?.[0]?.pciName}

这种写法会在childList1为undefined，或数组为空时返回undefined，既符合TypeScript严格类型检查，也不会触发运行时错误。

2. 存在性检查+类型断言（适用于确定数据存在的场景）

如果你能保证childList1一定存在且数组不为空，可以先做存在性判断再断言：

{record.childList1 && record.childList1[0] ? (record.childList1[0] as CheckListItemChildVO).pciName : ''}

或者使用非空断言（需谨慎，仅当100%确认数据存在时使用，否则会引发运行时错误）：

{record.childList1![0]!.pciName}

修改后的完整代码示例 #

<Table.Column
   key='childList1'
   dataIndex='childList1'
   title={<div style={{ textAlign: 'center' }}>standard</div>}
   render={(text, record: CheckListItemVOExtender) => (
      <div style={{ display: 'flex', flexDirection: 'column' }}>
      <p style={{ whiteSpace: 'pre-wrap' }}>{record.childList1?.[0]?.pciName}</p>              
      </div>)}/>

type CheckListItemVOExtender = CheckListItemVO & {
  sparPoint: string | number;
};

export type CheckListItemVO = CCheckListItem & {
  childList1?:CheckListItemChildVO[]; 
}

export type CCheckListItem = {
  pciName?:string; 
}

为何之前的写法无效 #

• 第一种写法record.childList1[0]?.pciName：先访问record.childList1[0]，但childList1可能是undefined，访问索引的操作会先触发childList1 is possibly undefined错误，可选链加在[0]后无法覆盖前置的风险。
• 第二种写法(record.childList1[0] as CheckListItemChildVO).pciName：同样先访问record.childList1[0]，未处理childList1本身为undefined的情况，类型断言无法解决前置的类型错误。

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