onChange?:( ValueType,ActionMeta)=> void,与OptionType不兼容

问题描述 投票:1回答:1

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

来自流量的错误

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;
javascript reactjs flowtype react-select
1个回答
1
投票

onChange收到的函数输入如下:

onChange: (ValueType, ActionMeta) => void,

ValueType定义如下:

type ValueType = OptionType | OptionsType | null | void

哪里有OptionsType = Array<OptionType>

(Qazxswpoi)

因此,基于此,您还应该将值类型Referencenull添加到undefined/void的类型中。

handleChange
© www.soinside.com 2019 - 2024. All rights reserved.