react获取input value值的二中方法

· 第一可以用event

· 第二可以用ref

1.第一种ref

import './aap.css'
import React from 'react';
class  examplePage extends React.Component {
      
  inputChange(){
     var username=this.refs.username.value
     this.setState({
      date: username
    });
   
  }
  
  click2=()=>{
    alert(this.state.date);
  }


render() {
    return (
     <div className="App">
      <br />
      <h1>Hello, world!</h1>
      <h1>现在的时间是:</h1> <h1 id="files"></h1>
       <div id="input-border">
          <input placeholder="请输入账号" ref='username' onChange= 
            {()=>this.inputChange()}/><br/>
          <input placeholder="请输入密码" ref='password' onChange= 
            {()=>this.inputChangev()} /><br/>
          <button onClick={this.click2}>点击2</button>
       </div>   
      </div>
    );
  }


}
  
  export default examplePage;

  

第二种event 

import './aap.css'
import React from 'react';
class  examplePage extends React.Component {
      
   
  inputChange(e){
     var username=e.target.value
     this.setState({
      date: username
    });
   
  }
  
  click2=()=>{
    alert(this.state.date);
  }


render() {
    return (
     <div className="App">
      <br />
      <h1>Hello, world!</h1>
      <h1>现在的时间是:</h1> <h1 id="files"></h1>
       <div id="input-border">
          <input placeholder="请输入账号" onChange={(e)=>this.inputChange(e)}/><br/>
          <input placeholder="请输入密码" onChange={(e)=>this.inputChangev(e)} /><br/>
          <button onClick={this.click2}>点击2</button>
       </div>   
      </div>
    );
  }

}
  
  export default examplePage;