ReactJS - 入力に関する情報を取得できません

Question

私はreactjsで新規です。私は自分の入力フィールドの価値をどのように得ることができるのか分かりません。私がコンポーネントをどのようにコードするかを示す最良の方法：

create class inputFields extends React.Component{ 
    getAllInformationAsJSON() { 
    return { 
     company : this.refs.company.getText(), 
     street : this.refs.street.getText(), 
     plz : this.refs.plz.getText(), 
     city : this.refs.city.getText(), 
     description : this.refs.description.getText(), 

    } 
} 

render() { 
    return (
     <div style={cssStyle.bodyStyle}> 
      <FormComponentText ref="company" placeholder= {Translation.Location.firmaPlaceholder}/> 
      <FormComponentText ref="street" placeholder={Translation.Location.streetPlaceholder}/> 
      <FormComponentText ref="plz" width='20%' placeholder={Translation.Location.PLZPlaceholder}/> 
      <FormComponentText ref="city" width='80%' placeholder={Translation.Location.placePlaceholder}/> 
      <FormComponentArea ref="description" rows='7' placeholder={Translation.Location.descriptionPlaceholder}/> 
      <div><button onClick={this.getAllInformationAsJSON}>Test</button></div> 
     </div > 
    ) 
} 
} 

これをHTML文書でレンダリングすれば、うまくいきます！

render(){ 
     return (<inputFields />) 
} 

私は関数を呼び出すと、私はすべての情報を取得します。しかし、私は他のコンポーネントでこのコンポーネントを配置する：

addChild(component) { 

    viewTitle = Translation.Settings.User.title; 
    viewConfig.view.window.width = 600; 
    viewConfig.view.window.height = 400; 
    *bodyInfo* = <**inputFields** />; 

    this.props.addComponentToView(<JSPanel idInfo="" config={viewConfig} title={viewTitle} bodyInfo={*bodyInfo*}/>); 
} 

JSPanel：私が欲しいもの

class JSPanel extends React.Component { 

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


sendInformation() { 
    var test = findDOMNode("TEST"); 
    request("/componente/location", requestData.POST, '{info:test}', requestData.CONTENT_JSON) 
     .then(token => { 

     }).catch(err => console.log(err)) 
} 


render() { 
    return this.state.showImage ? (<div ref="ich" style={this.state.css.view}> 
      <div style={this.state.css.body}> 
       {this.props.**bodyInfo**} 
      </div> 
     </div> 
    ) : (<div></div>) 
} 

が機能することにより、入力からの情報を得ることです：sendInformation（）

これは私が何を意味し、誰でも私を助けることができることを願っていますか？

よろしく

Answer 1

これを行うには良い方法は、状態の値を格納することで、ユーザーの種類、それらhttps://facebook.github.io/react/docs/forms.html#controlled-components