當我們在專案中遇見文字輸入框的時候，獲取時刻輸入框中的值

1、受控元件

class NameForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};
  }
 render() {
    return (
          <input type="text" value={this.state.value} onChange={this.handleChange} />
    );
  }
   handleChange(event) {
    
 
this.setState({value: event.target.value});
  }
}

2、非受控元件

class NameForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};
  }
 render() {
    return (
          <input 
　　　　　　　　　　type="text" 
　　　　　　　　　　ref={el=>this.input =el}

　　　　　　 />
　　　　　　<button

　　　　　　></button>
    );
  }
　　Searchtitle(){
　　　　console.log(this.input.value)  //實時的獲取輸入框中的值
　　}
   handleChange(event) {
    this.setState({value: event.target.value});
  }
}