セマンティック-UI-反応のonChange状態

Question

を更新するために動作しませんでしたReduxの形式のドロップダウン私はReduxのは、（等しい状態）のonChange値の状態を取得していないという問題を持ってここで

は私のコード

です

ReduxFormDropdown.js

import React from 'react' 
import { PropTypes } from 'prop-types' 
import { Icon, Dropdown } from 'semantic-ui-react' 
import FormLabel from '../FormLabel' 

export const ReduxFormDropdown = ({ 
    input, 
    label, 
    placeholder, 
    meta: { 
    error, 
    touched, 
    }, 
    ...custom 
}) => { 
    const errorMessage = (
    <div style={{ color: '#E20000', paddingTop: '.3rem', fontSize: '12px' }} > 
     <Icon name="warning" /> 
     {error} 
    </div> 
) 

    return (
    <div> 
     <FormLabel>{label}</FormLabel> 
     <Dropdown 
     placeholder={placeholder} 
     value={input.value} 
     onChange={(param, data) => props.input.onChange(data.value)} 
     error={touched && error} 
     selection 
     {...input} 
     {...custom} 
     /> 
     {touched && error && errorMessage} 
    </div> 
) 
} 

ReduxFormDropdown.propTypes = { 
    input: PropTypes.object.isRequired, 
    label: PropTypes.string, 
    placeholder: PropTypes.string, 
    meta: PropTypes.shape({ 
    touched: PropTypes.bool, 
    error: PropTypes.string, 
    }), 
} 

Form.js

//...  
const genders = [ 
    { 
    key: '1', 
    text: 'Male', 
    value: 'male', 
    }, 
    { 
    key: '2', 
    text: 'Female', 
    value: 'female', 
    }, 
    { 
    key: '3', 
    text: 'Other', 
    value: 'other', 
    }, 
] 
//...  

<Form.Field> 
    <Field 
    name="gender" 
    component={ReduxFormDropdown} 
    placeholder="Gender" 
    options={genders} 
    /> 
</Form.Field> 
//... 

私が選択したときに値が変わらず、redux devツールをチェックしたときに値が更新されていないことがわかりました（状態は同じです）。何が欠けていたのですか？ご回答いただきありがとうございます。

<Dropdown 
    onChange={(param, data) => props.input.onChange(data.value)} 
    {...input} 
/> 

props.inputとinputはonChange機能が含まれている同じオブジェクトです：

Answer 1

私が最も重要な行を強調してきました。したがって、inputオブジェクトをDropdownコンポーネントに広げているときは、onChangeハンドラを上書きしています。

正しい使用方法は次のとおりです。

<Dropdown 
    {...input} 
    onChange={(param, data) => props.input.onChange(data.value)} 
/>