对象可能是“null”——TypeScript linter 出错答案

【问题标题】：Object is possibly "null" - error with TypeScript linter对象可能是“null”——TypeScript linter 出错
【发布时间】：2019-11-16 19:03:09
【问题描述】：

我有一个关于 TypeScript 的问题！我们正在我们的项目中进行 JSX 到 TypeScript 的转换。

  {instances.map(instance => {
    const { id, name, type } = second;

    const pageUrl = makePath(
      routes.page.path,
      { firstId: first.id , secondId: id }, <<<<<<
    );

在带有“

Object is possibly 'null'.

我不确定如何将其定义为不会被视为 null 的位置。我能够通过解构找出第二个，但你不能定义“id”两次。任何指导将不胜感激！

【问题讨论】：

您的问题中没有足够的上下文来提供答案。能否请您包含更多周围的代码，尤其是在此处包含不会产生错误的内容：typescriptlang.org/play/#code/…

标签： javascript reactjs typescript jsx tslint

【解决方案1】：

如果我在组件前面定义它似乎可以工作，

  const firstId = (first ? first.id : '');

并将firstId: first.id 替换为firstId: firstId。

如果这不是推荐的解决方案，请告诉我！但是，它确实解决了我看到的错误，并且似乎根本不会影响功能。

【讨论】：

【解决方案2】：

类型检查器无法确定first 是否永远不会是null。您可以在有问题的对象之后直接添加non-null assertion operator ! 告诉 linter 它不会为空，试试这个：

{ firstId: first!.id , secondId: id }, <<<<<<

【讨论】：