在react-select事件处理程序上进行严格设置时出现TypeScript编译错误
我正在用TypeScript编写一个React组件，用tsconfig.json编写strict: true。
给定package.json中的以下内容
"devDependencies": {
"@babel/cli": "^7.0.0-rc.1",
"@babel/core": "^7.0.0-rc.1",
"@babel/plugin-proposal-class-properties": "^7.0.0-rc.1",
"@babel/preset-env": "^7.0.0-rc.1",
"@babel/preset-react": "^7.0.0-rc.1",
"ajv": "^6.5.2",
"awesome-typescript-loader": "^5.2.0",
"babel-loader": "^8.0.0-beta.4",
"css-loader": "^1.0.0",
"html-webpack-plugin": "^3.2.0",
"less": "^3.8.0",
"less-loader": "^4.1.0",
"react": "^16.4.2",
"react-dom": "^16.4.2",
"reactstrap": "^6.3.1",
"source-map-loader": "^0.2.3",
"style-loader": "^0.21.0",
"typescript": "^3.1.1",
"webpack": "^4.16.4",
"webpack-command": "^0.4.1"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.0-14",
"@fortawesome/free-solid-svg-icons": "^5.1.0-11",
"@fortawesome/react-fontawesome": "0.1.0-11",
"@types/react": "^16.4.14",
"@types/react-dom": "^16.0.8",
"@types/react-select": "^2.0.4",
"@types/reactstrap": "^6.4.0",
"bootstrap": "^4.1.3",
"immutable": "^4.0.0-rc.9",
"npm": "^6.4.1",
"react-compound-slider": "^0.15.0",
"react-select": "^2.0.0",
"rxjs": "^6.2.2"
}我发现了一个只在strict模式下出现的react-select事件处理程序错误。
下面是react-select组件：
<Select options={options}
isMulti={true}
onChange={this.props.handler(this.props.name)} />props中的处理程序函数是curried的，其形状如下：
handler: (s: string) => (o: Array<Option>) => void其中Option是一个行人集装箱。
export interface Option {
value: string
label: string
}编译错误是这样的：
TS2322: Type '(o: Option[]) => void' is not assignable to type '(value:
ValueType<Option>, action: ActionMeta) => void'.正如我之前提到的，在我使用strict之前没有任何问题。
你能解释一下这里的问题是什么以及如何解决它吗？
回答 1
Stack Overflow用户
发布于 2018-09-30 06:33:48
正如您在错误消息中看到的，react-select传递给您的处理程序的第一个参数的类型是ValueType<Option>；如果您查看ValueType和OptionsType的定义，您将看到它扩展为Option | Option[] | null | undefined。当您启用strictFunctionTypes (它是strict的一部分)时，您的处理函数需要接受由react-select传递的类型或超类型(更通用的类型)。特别是，您的处理函数必须既接受Option[]，也接受Option。如果另外启用了strictNullChecks (它也是strict的一部分)，那么处理函数还必须处理null和undefined。
如果没有strictFunctionTypes，则允许处理程序接受ValueType<Option>的子类型，即使这是不合理的，因为react-select可能会向处理程序传递它无法处理的参数。有关详细信息，请参阅this handbook page。
https://stackoverflow.com/questions/52572815
复制相似问题