javascript - 改变？ : (ValueType, ActionMeta) => 无效，与 OptionType 不兼容

Question

我经常从 react-select 的流程中收到错误。这是在更新到 v2.4.2 后发生的。很明显，我正在将正确的类型传递给句柄更改，它期望带有对象的数组 + OptionType 接受任何字符串 [string]: any。任何人都可以解释为什么会发生这种情况，或者这是 react-select 流程类型中的潜在错误？

流程错误

Error:Error:line (104)Cannot create `Select` element because array type [1] is incompatible with `OptionType` [2] in the first argument of property `onChange`.
    Error:Error:line (104)Cannot create `Select` element because array type [1] is incompatible with null [2] in the first argument of property `onChange`.
    Error:Error:line (104)Cannot create `Select` element because array type [1] is incompatible with undefined [2] in the first argument of property `onChange`.

组件示例

// @flow
import * as React from 'react';
import Select from 'react-select';

type LabelValueObject = Object & {
    value: string,
    label: string
}

type State = {
    options: LabelValueObject[],
    selectedOptions: LabelValueObject[],
}

export class ServiceDropdown extends React.Component<Props, State> {
    constructor(props: Props) {
        super(props);

        this.state = {
            options: [],
            selectedOptions: null,
        };
    }

    handleChange = (selectedOptions: LabelValueObject[]): void => {
        this.setState({ selectedOptions });
    };

    render() {
        const { selectedOptions } = this.state;
        return (
            <>
                <Select
                    isMulti
                    isSearchable
                    onChange={this.handleChange}    <=== flow error
                    value={selectedOptions}
                    options={this.state.options}
                />
            </>
        );
    }
}

export default ServiceDropdown;

Answer 1

onChange接收到的函数键入如下:

onChange: (ValueType, ActionMeta) => void,

ValueType定义如下:

type ValueType = OptionType | OptionsType | null | void

哪里OptionsType = Array<OptionType> .

( Reference )

因此，基于此，您还应该添加值类型 null和 undefined/void到 handleChange 的类型.

 handleChange = (selectedOptions: LabelValueObject | LabelValueObject[] | null | void) => { ... }