2016-04-30 10 views
5

Ich kann einen Standardwert eines Formulars mit Redux-Formular nicht festlegen. Das Ergebnis, nach dem ich suche, ist ein editierbares Textfeld, um es später an die Datenbank zu senden. d.h. Aktualisieren einer E-Mail-Adresse.kann keinen Standardwert in redux-form w setzen. reagieren

Ich habe versucht, eine Eigenschaft in Form zu Wert oder default Einstellung. Hinweis: Ich habe Wiederholungscode verwendet, um das Lesen mit nur einem "Name" -Feld zu erleichtern.

jeder einblick ist willkommen!

import React, { Component, PropTypes } from 'react'; 
    import { reduxForm } from 'redux-form'; 
    export const fields = [ 'name'] 

     //(container) page-profile.js 

      import React, { Component } from 'react'; 
      import { connect } from 'react-redux'; 
      import Profile from '../components/Profile'; 

      class PageProfile extends Component { 

       render() { 
       return (
       <Profile 
        userInfo = {this.props.userInfo} 
       /> 
       ) 
       } 
      } 
      // requiring this page before rendering -- breaks page 
      PageProfile.propTypes = { 
       //userInfo: PropTypes.object.isRequired 
      } 

      function mapStateToProps(state) { 
       return { 
       userInfo : state.auth.userInfo 
       } 
      } 


      // injection to child 
      export default connect(mapStateToProps, { 
      })(PageProfile); 





      // profile.js 

     export default class Profile extends Component { 
       render() { 
       const { fields: {name }, resetForm, handleSubmit, submitting } = this.props 
       return (
        <div> 
        <img className="image" src={this.props.userInfo.img_url}/> 

        <form onSubmit={handleSubmit}> 
        <div> 
        <div> 
         <label>name</label> 
         <div> 
         <input type="text" defaultValue={this.props.userInfo.name} placeholder="name" {...name}/> 
         </div> 
         {name.touched && name.error && <div>{name.error}</div>} 
        </div> 
         <button type="submit" disabled={submitting}> 
         {submitting ? <i/> : <i/>} Submit 
         </button> 
        </form> 
        </div> 
       ) 
       } 
      } 
      Profile.propTypes = { 
       fields: PropTypes.object.isRequired, 
       handleSubmit: PropTypes.func.isRequired, 
       resetForm: PropTypes.func.isRequired, 
       submitting: PropTypes.bool.isRequired 
      } 

      export default reduxForm({ 
       form: 'Profile', 
       fields, 
       validate 
      })(Profile) 
+0

warum nicht nur Wert verwenden? Wenn sie es ändern wollen, können sie es ändern. Sie setzen auch keinen Wert auf die Eingabe, also versuchen Sie 'defaultValue' in' value' zu ​​ändern. –

+0

Ich habe es auch mit Wert versucht, es hat auch nicht funktioniert. es ist das Seltsamste. –

Antwort

8

Sie können initialValues in reduxForm ‚s mapStateToProps liefern:

const mapFormToProps = { 
    form: 'Profile', 
    fields, 
    validate 
}; 

const mapStateToProps = (state, ownProps) => ({ 
    initialValues: { 
    name: ownProps.userInfo.name 
    } 
}); 

reduxForm(
    mapFormToProps, 
    mapStateToProps 
)(Profile) 

Dann binden wie so: <input type="text" placeholder="name" {...name} />.

Verwandte Themen