2017-05-23 3 views
1

그래서 저장소에 값이 채워진 Redux Form을로드하려고합니다. 그러나 나는 null 이외의 것을 다시 얻을 수 없습니다. 몇 시간 동안 지금 여기에 있었고 여러 가지 일을 시도하는 여러 가지 예를 읽고 내가이 벽에 불과하다고 생각했습니다.Redux-Form 초기 값

Redux Form Initializing from State example

  • 돌아 오는 다음 : 3.6.0
  • 반작용-돌아 오는 : 5.0.3
  • 돌아 오는 형태 : 6.6.3
  • 반응 : 15.4.2

하위 구성 요소를 양식으로 렌더링하는 상위 구성 요소가 있습니다. 최소한의 코드를 넣고 가능한 한 일반적인 이름을 만드는 간결함을 위해서. 모든 것이 잘로드되지만 문제는 내 가게에 제대로 연결되어 있지 않은 것에 달려 있다고 생각합니다. 아니면 그냥 componentWillMount에 데이터를로드해야합니까?

부모 구성 요소 :

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { fetchUser } from '../actions/usersActions'; 

import ChildForm from './ChildForm.jsx' 

@connect((store) => { 
    return{ 
    user: store.users.user 
    } 
}) 

export default class Parent extends Component{ 
    componentWillMount(){ 
    this.props.dispatch(fetchUser(this.props.match.params.id)) 
    } 
    submit = (values) => {//do some stuff} 

    render(){ 
    return(
     <ChildForm onSubmit={this.submit} /> 
    ); 
    } 
} 

ChildForm :

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { Field, reduxForm } from 'redux-form'; 
import { user } from './reducers/usersReducer.js'; 

class ChildForm extends Component{ 
    render(){ 
    console.log('FORM STATE >>>>>>>>>>', this.state); //Returns NULL 
    const { handleSubmit } = this.props; 
    return(
     <form onSubmit={handleSubmit}> 
     <div> 
      <label htmlFor="firstName">First Name</label> 
      <Field name="first_name" component="input" type="text"/> 
     </div> 
     <button type="submit">Submit</button> 
     </form> 
    ); 
    }  
} 

ChildForm = reduxForm({ 
    form: 'childForm', 
    enableReinitialize : true // I found this in another SO Example 
})(ChildForm); 

ChildForm = connect(
    state => ({ 
    user: state.user, 
    initialValues: state.user 
    }), 
    { fetchUser } 
)(ChildForm) 

export default ChildForm; 

enableReinitialize SO

usersReducer.js

012,351,
export default function reducer(state={ 
    user: {}, 
}, action){ 
    switch (action.type){ 
    case "FETCH_USER_FULFILLED":{ 
     return{ 
     ...state, 
     user: action.payload 
     } 
    } 
    } 
    return state; 
} 

여기 현재 내가 현재 있습니다. 페이지를 만들고 양식을 작성하고 모든 작업을 제출할 수 있습니다. 그러나 나는 내 Store 값을 양식 필드로 가져 오는 방법을 알아낼 수 없습니다. 어떤 도움이라도 대단히 감사하겠습니다.

답변

0

모든 것이 올바르게 연결되어 있지만 저장소의 올바른 개체를 당기지 않은 것 같습니다.

ChildForm = connect(
    state => ({ 
    initialValues: state.users.user 
    }), 
    { fetchUser } 
)(ChildForm) 

...

거의 항상 뭔가