2017-06-26 7 views
0

これは私のコンポーネントです - 初期値を読み込めません - フォームが送信されたときに検証エラーが発生し、初期値を更新するさまざまな方法が試されましたが、私はここで何が欠けていますか?既存の値を小道具として渡す方法は?reduxフォームの初期値 - エラーが発生しました

import React, { PropTypes, Component } from 'react'; 
    import { reduxForm } from 'redux-form'; 
    import { Link } from 'react-router'; 
    import * as actions from '../../actions/myactions'; 

    class Component extends Component { 

     constructor(props) { 
     super(props); 
     this.handleFormSubmit = this.handleFormSubmit.bind(this); 
     } 

     componentDidMount() { 
     this.props.getapidata(param); 
     } 

     handleFormSubmit({ email, name }) { 
     this.props.createNewvalues(url, { 
      email: emailval, 
      name: nameval, 
     }) : 
     } 

     renderAlert() { 
     //blah 
     } 

     render() { 
     const email = this.props.apiData && this.props.apiData.email ? this.props.apiData.email : []; 
     const fname = this.props.apiData && this.props.apiData.fname ? this.props.apiData.fname : []; 
     const initialvalues = { 
      email: email_from_api, 
      CCemail: name_from_api, 

     }; 
     const { handleSubmit, fields: { email, name } } = this.props; 
     return (
      <div> 
      <div> 
       <form onSubmit={handleSubmit(this.handleFormSubmit)}> 
        <fieldset> 
         <div> 
         <input value={emailsval} id="email" {...email} type="email"} required multiple /> 
         <label className="input-label" htmlFor="Email">To</label> 
         { email.touched && email.error && <div> { email.error } </div> } 
         </div> 
        </fieldset> 
        <fieldset> 
         <div> 
         <input value={nameval} id="name" {...name} type="email"} multiple /> 
         <label className="input-label" htmlFor="name">name (optional)</label> 
         { name.touched && name.error && <div> { name.error } </div> } 
         </div> 
        </fieldset> 

       </form> 
      </div> 
      </div> 
     ); 
     } 
    } 
    function validate(formProps) { 
     const errors = {}; 
     if (!formProps.email) { 

     } 
     if (!formProps.name) { 

     } 
     return errors; 
    } 

    function mapStateToProps(state) { 
     return { 
     responseData: state.actions.responseData, 
     initialValues: state.actions.apidata, 
     }; 
    } 

    export default reduxForm({ 
     form: 'myform', 
     enableReinitialize: true, 
     fields: [ 
     'email', 
     'name', 
     ], 
     validate, 
    }, mapStateToProps, actions)(Component); 
+0

あなたは小道具としてinitialValuesを追加しようとしましたか?あなたは 'enableReinitialize'の隣に置くか、またはそれらをpropsとして渡すことができます。 – BHubbard

答えて

0

コンポーネントにdefaultPropsを追加する必要があります。

class App extends from React.Component{ 
    constructor(props){ 
    super(props); 
    } 

    render(){ 
     let { data } = this.props; 
     return <h1>{ data }</h1> 
    } 
} 

App.deafultProps = { 
    data: 'Sample text' 
} 
0

接続先はどこですか?エクスポートを再配置してみてください。これは私のために働いた

export default connect(mapStateToProps, { load_default , update_section})(
reduxForm({ 
    form: 'myForm', 
    enableReinitialize : true 
})(EditSection) 
); 
関連する問題