reactjs - Reactjs と redux-form: redux-form のラップされた react-select コンポーネントで onChange または onBlur を使用できません

Question

react-selectコンポーネントを使用しています。redux-formライブラリとそのフィールドを使用しているため、react-select をラップして redux-form フィールドで使用し、フォームの値を送信する必要があります。このように<Field name="customselect" component={RenderSelectInput} />。ただし、ラップされた react-select コンポーネントを使用すると、カスタムonChangeと関数を使用できません。onBlurこのような<Field name="customselect" component={RenderSelectInput} onChange={this.handleChange}/>

これはRenderSelectInput.jsです

import React, {PropTypes} from 'react';
import Select from 'react-select';
import 'react-select/dist/react-select.css';

export default (props) => (
    <Select {...props}
        value = {props.input.value}
        onChange = {(value) => props.input.onChange(value) }
        onBlur = {() => props.input.onBlur(props.input.value) }
        options = {props.options}
    );

ホームページ.js

import React, {Component} from 'react';
import { Field, reduxForm} from 'redux-form';
import RenderSelectInput from './RenderSelectInput';

class homepage extends Component {
    constructor(props) {
        super(props);
        this.handleChange = this.handleChange.bind(this);
    }


    handleChange(event) {
        alert("success");
    }

    render() {

        const options = [{ value: 'value1', label: 'sample1' }, { value: 'value2', label: 'sample2' }];

        return (

            <div>
                <Field name="customselect" component={RenderSelectInput} onChange={this.handleChange} options={options} />
            </div>
        )
    }
}


export default homepage; 

上記のプログラムでは、前述したように、ラップされた react-select の値を変更すると、「成功」アラートを表示したいだけです。ガイドしてください。

ありがとう、シャッシュ