변경 양식 onChange가 상태를 업데이트하지 않습니다.

Question

내 비밀번호 <input/>에 입력 할 때 이상한 행동을하고 있습니다. 내가 그 안에 무언가를 입력 할 때마다 상태는 바뀌지 않지만 console.logs는 바뀌지 않습니다. 같은 일이 이메일 필드에서 발생하지 않으며 양식을 제출하려고 할 때 비밀번호가 비어 있습니다 ... 내가 뭘 잘못하고 있니?

이 내 반응 구성 요소입니다

가 사전에 감사합니다

여기

5 export default class Login extends React.Component { 
    6 state: { 
    7  email: string, 
    8  password: string, 
    9 }; 
10 
11 handleEmailChange: (e: any) => void; 
12 handlePasswordChange: (e: any) => void; 
13 handleButtonPress:() => void; 
14 
15 constructor() { 
16  super(); 
17  this.state = { email: '', password: '' }; 
18 
19  this.handleEmailChange = this.handleEmailChange.bind(this); 
20  this.handlePasswordChange = this.handleButtonPress.bind(this); 
21  this.handleButtonPress = this.handleButtonPress.bind(this); 
22 }; 
23 
24 handleEmailChange(e: any) { 
25  this.setState({ email: e.target.value }); 
26 }; 
27 
28 handlePasswordChange(e: any) { 
29  this.setState({ password: e.target.value }); 
30 }; 
31 
32 handleButtonPress() { 
33  axios.post('/api/users/login', { 
34  email: this.state.email, 
35  password: this.state.password, 
36  }) 
37  .then((response: any) => { 
38  console.log(response.data); 
39  }) 
40  .catch((error: any) => { 
41  console.log(error); 
42  }); 
43 }; 
44 
45 render() { 
46  return (
47  <div> 
48   <input 
49   type="email" 
50   onChange={this.handleEmailChange} 
51   placeholder="Enter email" 
52   /> 
53   <input 
54   type="password" 
55   onChange={this.handlePasswordChange} 
56   placeholder="Enter password" 
57   /> 
58   <button onClick={this.handleButtonPress}> 
59   Login! 
60   </button> 
61  </div> 
62 ); 
63 } 
64 } 

내가 암호를 입력 갈 때 일어나는의 스크린 샷이다.

Answer 1

줄 20의 오류.

this.handlePasswordChange = this.handleButtonPress.bind(this); 

이 있어야한다

this.handlePasswordChange = this.handlePasswordChange.bind(this);