React TS条件渲染返回后仍出类型错误，疑惑分支执行逻辑

这是TypeScript静态类型检查的特性导致的，和运行时执行逻辑不是一回事：

1. 类型推断问题
   当你把useState里的project数组初始值设为空数组，又没显式指定类型时，TypeScript会把数组推断成never[]类型——因为没有任何元素能让TS推导数组元素的具体类型，never表示不存在的类型，自然没有title属性。

2. 静态检查不关心运行时分支
   虽然运行时因为数组为空，代码会走到return "No project"的分支，不会执行到遍历数组访问title的代码，但TypeScript是编译阶段的静态检查，它会扫描所有可达代码的类型合法性，不管运行时会不会执行到。所以哪怕那段代码在运行时不会跑，TS还是会检查它的类型，发现never类型没有title，就抛出错误。

解决办法 #

给useState显式指定数组元素的类型就行：

首先定义项目的类型：

interface Project {
  title: string;
  // 其他需要的属性...
}

然后初始化state时指定类型：

const [projects, setProjects] = useState<Project[]>([]);

这样TS就明确知道数组里是Project类型的元素，访问title就不会报错了。

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