Question

我有两个create-react-app +我在过去几个月中一直在使用TypeScript应用程序。在某个时候（我可能升级了lib），tslint在为state指定类型时开始在this.setState({ [name]: value })上引发错误。它曾经让它滑动（除非我发疯了...并非不可能）。

关闭tslint的唯一方法是将状态类型更改为any，这是我不想做的。如果我保存文件并让yarn start进行更改，那么它运行良好...因此我可以忽略tslint在vscode中引发的错误。

我了解为什么tslint会引发错误。我想知道是否可以设置一个规则来忽略此特定错误？

我在哪里看到此示例（第5行）：

class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
...
private handleOnChange = (event: any) => {
    const { name, value } = event.target;
    this.setState({ [name]: value });        <-- tslint no likey
}

错误：

[ts] 类型'{[x：number]的参数：任意； }'不可分配给'IMyComponentState |类型的参数（（（prevState：只读，pro ...'。输入'{[x：number]：任意； }'不能分配给'Pick类型

Answer 1

class MyComponent extends React.Component<IMyComponentProps, IMyComponentState> {
...
private handleOnChange = (event: any) => {
    const { name, value } = event.target;

    // @ts-ignore
    this.setState({ [name]: value });        <-- tslint no likey
}

Answer 2

您也可以在这里使用此解决方案：

interface IState {
    [key: string]: any; // or the type of your input
}

我想那总比忽略警告更好。

React，Typescript和setState（{[name]：value}）错误

2 个答案: