title: I can't edit Text Field in Material-UI
body: <p>I developed a React App using Material-UI then I tried to create <strong>independent Components</strong>,</p>
  
  <p>check the below independent components(<code>&lt;PanelDiv/&gt;</code>),</p>
  
  <pre><code>render() {
          return (
              &lt;div className="panelDiv-component" style={{display:this.props.display}}&gt;
                  &lt;div className="panel-field-content"&gt;
                      &lt;TextField
                          floatingLabelText={this.props.heading}
                          type={this.props.inputType}
                          value={this.props.value}
                      /&gt;
                     {/* &lt;input  defaultValue className="form-control"&gt;&lt;/input&gt;*/}
                  &lt;/div&gt;
              &lt;/div&gt;
          );
      }
  </code></pre>
  
  <p>I tried to use the component like this,</p>
  
  <pre><code>&lt;PanelDiv
      heading='name'
      inputType="text"
      value={this.state.userData.name}
      display={this.state.display[0]}
  /&gt;
  </code></pre>
  
  <p>But I can't update input field in this way.Also there is no error. How can i solve this? I want to update my input field.</p>
  
  <p>Please check my input filed in the below image : </p>
  
  <p><a href="https://i.stack.imgur.com/FlqsN.png" rel="noreferrer"><img src="https://i.stack.imgur.com/FlqsN.png" alt="enter image description here"></a></p>