类型'undefined'不能用作索引类型

Question

我正在使用TypeScript Tutorial关注WintellectNow React。在第五部分中，作者进行排序和过滤，创建一个具有可选属性的界面，如下所示：

interface IWidgetToolState {
   filterCol?: WidgetTableCols;
   filterValue?: string;
   sortCol?: WidgetTableCols;
}

有一个名为WidgetTableCols的枚举如下：

enum WidgetTableCols {
    None, Name, Color, Size, Quantity, Price,
}

在一个函数中，作者获得了这样的枚举值：

const fName: string = 
WidgetTableCols[this.state.sortCol].toLocaleLowerCase();

这里我得到的类型'undefined'不能用作索引类型。如果我删除？从接口工作，但后来作者创建另一个函数，只设置状态值和打字稿之一说不是所有的状态属性都设置。

任何人都可以让我知道如何解决这个问题。

提前致谢。

Answer 1

编译器只是告诉您this.state.sortCol可能没有值，因为您有strictNullChecks标志。

您可以先检查它的存在：

const fName = this.state.sortCol != null ? 
WidgetTableCols[this.state.sortCol].toLocaleLowerCase() : null;

将删除错误（但您需要处理fName可以为null的事实。）

您还可以使用Non-null assertion operator：

const fName: string = 
WidgetTableCols[this.state.sortCol!].toLocaleLowerCase();

如果您确定它存在。