2017-11-20 1 views
1

redux 양식을 업데이트하는 방법 내 redux 저장소에서 미리 정의 된 필드 구성 요소 값? 입력란에 값이 표시되지만 입력란에 값을 업데이트 할 수 없습니다. onChange 이벤트를 트리거해야하지만 어떻게해야할지 모르겠다. 어쩌면 initialValue를 설정할 수있는 방법이 있을까요? 내 패키지 파일 :미리 정의 된 값에서 필드 값 업데이트 redux-form

"redux": "3.7.2", 
"redux-form": "^7.1.2", 
"react": "16.0.0", 

PS. defaultValue을 사용하고 싶었지만 redux-form 5.0.0 이후 삭제되었습니다.

코드 :

import React,{Component} from 'react'; 
import {Field, reduxForm} from 'redux-form'; 
import {connect} from 'react-redux'; 
import {fetchCeoData} from '../../actions/CMS'; 

class CEOForm extends Component{ 
    constructor(props) { 
    super(props); 
    this.renderTextarea = this.renderTextarea.bind(this); 
    } 

    componentDidMount(){ 
    this.props.fetchCeoData(); 
    } 

    submit(values){ 
    console.log(values); 
    } 

    componentWillReceiveProps(nextProps){ 
    console.log(nextProps); 
    } 

    renderTextarea({_id, title, description, content, input}){ 
    return(
     <div key={_id} className="cms-form-row"> 
     <label htmlFor={title}>{description}</label> 
     <textarea {...input} value={content} rows="6" cols="50"></textarea> 
     </div> 
    ) 
    } 
    render(){ 
    return(
     <section id="ceo-form"> 
     <h1 className="cms-section-header">Narzędzia CEO</h1> 
     <div className="ceo-form-wrapper"> 
      <form onSubmit={this.props.handleSubmit(this.submit)}> 
      {this.props.ceoData.map((item) => { 
       return <Field 
       name={item.title} 
       key={item._id} 
       title={item.title} 
       content={item.content} 
       description={item.description} 
       component={this.renderTextarea} 
       /> 
      })} 
      <button type="submit">Wyślij !</button> 
      </form> 
     </div> 
     </section> 
    ) 
    } 
} 

function mapStateToProps(state){ 
    return{ 
    ceoData: state.ceoData 
    } 
} 

function loadData(store) { 
    return store.dispatch(fetchCeoData()); 
} 

CEOForm = connect(mapStateToProps, {fetchCeoData})(reduxForm({form: 'ceo', enableReinitialize : true})(CEOForm)); 

export default{ 
    loadData, 
    component: CEOForm 
} 
+0

이 답변을 살펴보십시오. 나는 이것이 당신이 찾고있는 것 같아요 https://stackoverflow.com/questions/45230531/how-to-programatically-set-redux-form-field-value/45231071#45231071 –

+0

나는 당신이 원하는 것을 이해할 수 없습니다 exacly , 문제는 어떻게 초기 동적 입력 이름을 사용할 수 있습니까? –

+0

어쩌면 틀린 말을 사용했을 수도 있습니다. 내 redux 저장소에서 미리 정의 된 값을 가지고 있으며 필드에 배치하여 수정하고 API에서 작업을 편집하여 실행하고 싶습니다. – CacheGhost

답변

0

좋아. 여기에 내가 끝내주는 것이있다. 덧글에 sugested 게시물을 읽고 있었다 : How to programatically set Redux-Form Field value 하지만이 솔루션은 당신이 진술에 의해 조작하기 때문에 다소 이상합니다. MapStateToProps에서 redux 형식으로 설명 된 객체 속성을 initialValue로 사용했습니다. 예 :

Function mapStateToProps(state){ 
var data = _.pick(state.myprops, "name"); 
return{ 
    myprops: state.myprops, 
    initialValue: { 
     'nameOfMyField': data.name.fieldname 
    } 
} 
}