Question

React Typescript：无法读取未定义的属性

2022-01-15

1044

reactjs typescript

控制台显示了一个新对象，但我仍然收到错误

const GetNo = (): string => {
        console.log(record);
        if (record.no !== "")
            return record.no;   //<-- Cannot read properties of undefined
        else
            return todos[todos.length - 1].no + 1;
    }

控制台：

编辑：记录是对象类型（见上图），我通过 Button onClick 创建它，其中我修改了状态 this.setState({ selectedRecord: new ToDoClass() 。之后，我使用表单刷新了 FC 。

编辑 2：我尝试了新的语法：

const GetNo = (): string => {
        if (record == null) {
            console.log("1");
            return "2";
        }
        else if (record.no != null) {
            console.log("2");
            return record.no;
        }
        else {
            console.log("3");
            return todos[todos.length - 1].no + 1;
        }
    }

当记录为： new ToDoClass() 时，它返回在控制台中 2 但它应该放在第一个语句内？！

Answer 1

您的对象 record 在函数外部定义，可能未在函数执行时初始化。

我建议您：

将对象作为函数的参数传递
检查记录是否已定义

顺便说一句，如果您使用的是 Typescript，并且记录在传递给函数时可能未定义，您应该在调用 GetNo(record) 的行处收到警告。

const GetNo = (record: Record): string => {
   if (record) {
     // ...
   }
}

希望这会有所帮助！

Answer 2

我不知道为什么它会表现得像这样，但我用 Try-Catch 语句解决了它。

const GetNo = (): string => {
   try {
      if (record.no !== "")
         return record.no;
      else
         return todos[todos.length - 1].no + 1;
   }
   catch {
      return "0";
   }
}