React - pre-populate form

Question

사용자가 이전에 작성한 블로그를 편집 할 수 있도록 양식을 미리 채워야합니다. 나는 이것을 React에서하는 최선의 방법을 찾고있다. 현재 소품을 통해 구성 요소에 값을 전달하고 상태 속성을 소품 속성과 동일하게 설정했지만 반 패턴이라고 읽었습니다. 나는 '진리의 원천'을 이해한다. 그러나 그것을하는 더 좋은 방법은 무엇입니까? 나는 오히려 redux-form을 사용하지 않을 것이다. 아래는 내 제목 구성 요소이며 아래는 부모로부터 호출하는 방법입니다. 이 모든 것이 작동하지만 더 좋은 방법이 있습니까? 주 재산을 소품 속성으로 설정하지 않으려면 어떻게해야합니까? 부모로부터

import React, { Component, PropTypes} from 'react'; 

export default class DocumentTitle extends Component{ 
    constructor(props) { 
     super(props); 
     this.state = {inputVal:this.props.publication.document_title} 
     this.handleChange = this.handleChange.bind(this) 
    } 

    handleChange(event) { 
    this.setState({inputVal: event.target.value}); 
    } 

    componentWillReceiveProps(nextProps){ 
    this.setState({inputVal: nextProps.publication.document_title}) 
    } 

    render(){ 
    return (
     <div > 
     <label>Title</label> 
     <div> 
      <input onChange={this.handleChange} id="doc_title" type="text" value={this.state.inputVal}/> 
     </div> 
     </div> 
    )  
    } 
} 

전화 :

<DocumentTitle publication={this.props.publication} /> 

Answer 1

게시가 부모에 유지된다면 다른 이유가없는 한, 다음 상태를 유지 할 필요가 없습니다 : 하나에 대한 검증.

입력이 제어되지 않은 구성 요소 일 수 있습니다. 입력의 onBlur를 사용하여 부모를 업데이트 할 수 있습니다.

<input 
    onBlur={e => this.props.onTitleChange(e.target.value)} 
    id="doc_title" 
    type="text" 
    defaultValue={this.props.publication.document_title} /> 

상위 구성 요소는 게시 상태를 업데이트해야합니다.

<DocumentTitle 
    publication={this.state.publication} 
    onTitleChange={this.handleTitleChange} />