我无法正确输入onchange函数。我创建了一个处理函数,但是typescript一直抱怨类型不匹配。
我的职能:
private handleChange(options: Array<{label: string, value: number}>) {
}
typescript 错误:src/questionnaire-elements/AssessmentFactorSearch.tsx (43,9): Type '{ ref: "select"; name: string; backspaceToRemoveMessage: ""; value: { label: string; value: IAsse...' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Async<OptionValues>> & Readonly<{ children?: React...'. Type '{ ref: "select"; name: string; backspaceToRemoveMessage: ""; value: { label: string; value: IAsse...' is not assignable to type 'Readonly<ReactAsyncSelectProps<OptionValues>>'. Types of property 'onChange' are incompatible. Type '(options: { label: string; value: number; }[]) => void' is not assignable to type 'OnChangeHandler<OptionValues, Option<OptionValues> | Option<OptionValues>[]> | undefined'. Type '(options: { label: string; value: number; }[]) => void' is not assignable to type 'OnChangeHandler<OptionValues, Option<OptionValues> | Option<OptionValues>[]>'. (2322)
如何键入onchange方法?
9条答案
按热度按时间ghhaqwfi1#
基于https://github.com/JedWatson/react-select/issues/2902,只需像这样编写处理程序:
注意
MyOption | MyOption[] | null
部分,它与react-select库中onChange
的定义匹配相同的结构。创建自己的MyOption
类型。该issue线程中的另一个例子也表明,您可以内联传递函数,在这种情况下,处理程序参数的类型会自动推断:
g52tjvyc2#
对于react-select3.1.0下面的代码应该工作:
ukxgm1gy3#
2022,使用
"react-select": "^5.4.0"
和"typescript": "4.7.4"
。根据react-select文档,这对我很有效:
如果使用的是多选,则必须更改
handleSelectionChange
方法签名,以接收option
变量作为SelectOptionType
的只读数组(正如我命名的选项类型)。类似于:我没有使用可选的
actionMeta
,但是您也可以在handleSelectionChange
方法中接收它作为第二个参数。4jb9z9bj4#
2021答案:
1.不要使用@types/react-select库,它已被弃用
经办人:
其中:
具体如下:
sdnqo3pr5#
为选项值创建类型:
使用
MultiValue<SelectValue>
进行多值选择输入。SingleValue<SelectValue>
用于单值选择输入。ActionMeta
保存有关已执行操作的信息。例如,在多值选择输入中,它保存了关于从选择中添加或删除什么的信息。React Select版本:5.2.2
knpiaxh16#
第二个type参数指示
Select
应键入为多选选择还是单选。多选时用
Select<MyOption, true>
,单选时用Select<MyOption>
。umuewwlo7#
如果人们仍然有一个困难的时期,这是我工作的(不包括 meta):
62o28rlo8#
其他的答案对我不起作用。通过阅读错误信息,我得出了这个解决方案。请注意,这只适用于单选
xxslljrj9#
以上都不适合我。这件事起了作用。