Javascript 道具更改后，React子组件不更新

我在更改道具后渲染某些子组件时遇到了一个奇怪的问题。我正在使用react-select中的CreatableInput组件。如果您想查看它，可以在此处找到它，这也是一个源代码` 库本身使用内部状态来操作输入值，但在我的项目中，我需要使用redux store。在handleKeyDown中，我从内部状态获取值并将其发送到我的redux store，之后连接到store的父组件接收到更改，但它无法更新其子组件。当我在输入字段中写入一些内容并点击ENTER或TAB时，它实际上会更改存储，但不会立即显示值，只会在模糊后显示。它可以很好地处理内部状态，但不能处理外部状态

import React from 'react';
import CreatableSelect from 'react-select/lib/Creatable';
import * as fp from 'lodash/fp';

const components = {
    DropdownIndicator: null,
};

const createOption = label => ({
    label,
    value: label,
});

export default class CreatableInputOnly extends React.Component {
    state = {
        inputValue: '',
        value: {
            include: [],
            exclude: [],
        },
    };

    handleChange = leftValues => {
        this.props.clearInputValues({values: leftValues, filterType: this.props.filterType});

        this.setState({
            value: {
                include: fp.cond([
                    [fp.isEqual('include'), fp.constant(leftValues)],
                    [fp.stubTrue, fp.constant([...this.state.value.include])],
                ])(this.props.filterType),
                exclude: fp.cond([
                    [fp.isEqual('exclude'), fp.constant(leftValues)],
                    [fp.stubTrue, fp.constant([...this.state.value.exclude])],
                ])(this.props.filterType),
            },
        });

    };
    handleInputChange = inputValue => {
        this.setState({inputValue});
    };
    handleKeyDown = event => {
        const {inputValue, value} = this.state;
        const addValueToStore = this.props.addValueToStore;
        const filterType = this.props.filterType;

        if (!inputValue) return;
        switch (event.key) {
        case 'Enter':
        case 'Tab':
            this.setState({
                inputValue: '',

            }, () => {
                addValueToStore({values: createOption(inputValue), filterType});
            });

            event.preventDefault();
        }
    };
    render() {
        // eslint-disable-next-line prefer-const
        let {inputValue} = this.state;
        const {isMulti, isClearable, menuIsOpen, className, classNamePrefix, filterType, inputValues} = this.props;
        const allValues = fp.cond([
            [fp.isEqual('include'), fp.constant(inputValues.includeUrls)],
            [fp.isEqual('exclude'), fp.constant(inputValues.excludeUrls)],
            [fp.stubTrue, fp.constant([])],
        ])(filterType);
        console.log(inputValues.includeUrls, '<<<<<<<<<>>>>>>>>>>>>>>>>');

        return (
            <CreatableSelect
                components={components}
                inputValue={inputValue}
                isClearable={isClearable}
                isMulti={isMulti}
                menuIsOpen={menuIsOpen}
                onChange={this.handleChange}
                onInputChange={this.handleInputChange}
                onKeyDown={this.handleKeyDown}
                placeholder=""
                value={allValues}
                className={className}
                classNamePrefix={classNamePrefix}
            />
        );
    }
}