リアクト - セマンティック-UIとReduxのフォーム

Question

がアプリを反応させるので、私は自分のフォーム& Reduxのストアを処理するためにReduxのフォーム（素晴らしいLIBS）を使用していますを統合。 すべてがうまくいって、重要な形式と入れ子になったjson出力。

リアクションセマンティックUIコンポーネント還元型を使用しようとしています。 ドキュメントの中でカスタムコンポーネントをレフィックスフォームと統合する方法について調べました。ここでは次のようにします： http://redux-form.com/6.5.0/docs/faq/CustomComponent.md/ 完璧と思われます。

しかし、私はセマンティックとこれを統合すると、それは仕事ではありません。

これは、擬似コードと私の簡単なテストです：ドロップダウンを使用して、ここで

const TestComponent = props => (
<Form> 
    <Field name="dropdownTest" component={ TestSelect } /> 
</Form> 
) 

と私CustomComponent。あなたがここにドロップダウンドキュメント&小道具（のonChange &値）が発見することができます：ドキュメントのよう

http://react.semantic-ui.com/modules/dropdown

import Form , Dropdown from 'semantic-ui-react' 
import {myOption from './myOption' 

const TestSelect = field = (
    <Form.Field> 
      <label> Test dropdown </label> 
      <Dropdown option={myOption} selection 
            value={{val : field.input.value}} 
            onChange={ param => field.input.onChange(param.val)} /> 
    </Form.Field> 
) 

を、私は価値私のカスタムコンポーネントの&のonChange小道具を追加しました。

私はここで何かが間違っています。誰かがredux形式とsemantc UIで単純な例を持っていますか？

ありがとうございます。

Answer 1

私はsucced OK：

const TestComponent = props => (
<Form> 
    <Field name="dropdownName" component={ DropdownFormField} 
      label="Dropdown Test" 
     /> 

</Form> 
) 



const DropdownFormField = props => (
<Form.Field> 
    <Dropdown selection {...props.input} 
      value={props.input.value} 
      onChange={(param,data) => props.input.onChange(data.value)} 
      placeholder={props.label} 
    /> 
    </Form.Field> 
) 

そして、すべてが素晴らしい働いている：

を使用するには、これは単純な例で、セマンティックドロップダウンを反応します。 セマンティックとすべてのコンポーネントで同じことができます。

誰かがこの便利なことを知りたがっていますか？