Reactjs 失败的属性类型：提供给`TypeaheadContainer（WrappedTypeahead）的属性`defaultSelected`无效`

我将所选项目作为道具传递给我的组件，该组件利用react bootstrap typeahead并加载此组件的componentDidUpdate方法中的选项。我正在尝试有条件地添加“defaultSelected”属性，因为当选项尚未加载时，它似乎失败了，但我仍然收到以下错误：

失败的道具类型：为TypeaheadContainerRappedTypeahead提供的无效道具默认选择

selectedCourier是从props设置的，props是一个与GET couriers响应返回的选项之一匹配的对象。有什么帮助吗

constructor(props) {
    super(props);

    this.state = {
        step: props.step,
        selectedCourier: props.step.courier && props.step.courier.courierId ? props.step.courier : null,
        submitMessage: props.step.courier && props.step.courier.submitMessage ? props.step.courier.submitMessage : '',
        couriers: []
    };
}

componentDidMount = () => {
    nprogress.start();
    nprogress.configure({showSpinner: false, easing: 'ease', speed: 500});
    axios
        .get('/Couriers')
        .then(response => {
            console.log(this.state);
            this.setState({couriers: response.data});
            nprogress.done()
        })
        .catch(function (error) {
            nprogress.done()
        });
    console.log(this.state);
};

render() {
    var inputProps = {};

    if (this.state.selectedCourier != null && this.state.couriers.length > 0) {
        inputProps.defaultSelected = this.state.selectedCourier
    }
    return (
...
<Typeahead
 onInputChange={this.handleCourierSearchChange}
 labelKey="name"
 options={this.state.couriers}
 placeholder="Search couriers..."
 onChange={selected => {
     this.selectCourier(selected);
 }}
 id="courierSearch"
 ref={(ref) => this._typeaheadCouriers = ref}
 {...inputProps}
/>
)

defaultSelected和selected都需要一个数组，但它看起来像props.step.courier是一个对象。定义状态时请尝试以下操作：

this.state = {
  ...
  selectedCourier: props.step.courier && props.step.courier.courierId ? [props.step.courier] : [],
};

您也很可能希望使用selected而不是defaultSelected，因为它看起来像是一个受控组件。初始装载后，不会设置或更改defaultSelected，但您正在尝试在填充选项集时更新选择