Reduxフォーム：formReducerにアクセスできますか

Question

私が試したことは、コンテナコンポーネントのformReducerから値を取得することです。

2つのコンポーネントがあります。 1つはプレゼンテーションコンポーネントで、Redux-Formです。

class Form extends React.Component { 
    render() { 
     return (
     <div> 
      <form onSubmit={handleSubmit}> 
      <Field name="title" 
        component="input" 
        type="text"/> 
      </form> 
     </div> 
     ) 
    } 
} 

Form = reduxForm({ 
    form: 'PostEditor', 
    enableReinitialize: true, 
})(Form); 

Form = connect(
    state => ({ 
     initialValues: state.post.post, 
     enableReinitialize: true, 
    }), 
)(Form) 

export default Form; 

そして、他のは、私がformReducerにアクセスしたいのですがどこでその容器です。 Reduxの「店舗で

class PostEditor extends React.Component { 
    render() { 
     console.log("form", this.props.PostEditor);//This results in "undefined" 
     return (<Form onSubmit={data=> this.handleSubmit(data)}/>); 
    } 
} 

const mapStateToProps = (state) => { 
    return { 
     PostEditor: state.form 
    } 
} 
export default connect(mapStateToProps, null)(PostEditor); 

、フォームリデューサはstate.formなるように設定されているが、これはアクセスできません。

還元剤から値を取得することはできますか？

Answer 1

ReduxFormセレクタの1つを使用してください。

​​

ここでは、詳細なドキュメントがあります：Reduxのフォームからフォームのインポートの値は以下のセレクタ

import { formValueSelector } from 'redux-form'; 

はその後、フォームの名前を持つ関数を呼び出すアクセスするにはhttps://redux-form.com/7.2.0/docs/api/selectors.md/

Answer 2

をmapStateToPropsの値を取得します。

これは、Reduxストアの状態とともに値を取得するフィールドの名前とともに呼び出される関数を返します。

const mapStateToProps = (state) => { 
    return { 
     titleFieldValue: formValueSelector('PostEditor')(state, 'title') 
    } 
} 

複数のフィールドを取得する場合は、この関数呼び出しにさらに引数を追加できます。たとえば、

formValueSelector('PostEditor')(state, 'title', 'name', 'otherField') 

次の構文は、「カレー化」機能の例です。これは他の関数を返す関数に与えられた名前です。興味のある方は、thisを読んで、カレーを紹介してください。