我想测试redux表单字段中的onChange方法,当onChange方法被调用时,它应该设置本地状态。这是我要测试的容器代码。
constructor(props) {
super(props);
this.state = {
username: '',
password: ''
};
this.handleUserNameChange = this.handleUserNameChange.bind(this);
this.handlePasswordChange = this.handlePasswordChange.bind(this);
this.onSubmit = this.onSubmit.bind(this);
}
handleUserNameChange(event) {
this.setState({
username: event.target.value
});
}
handlePasswordChange(event) {
this.setState({
password: event.target.value
});
}
Run Code Online (Sandbox Code Playgroud)
这是将触发 onChange 方法的登录组件
const LoginForm = ({username, password, handleLogin, handleUserNameChange, handlePasswordChange, user_error, loading, loading_color}) => {
return (
<form name="form" onSubmit={handleLogin}>
<h1> Login Form </h1>
<Field
name="user_name"
type="text"
label="User Name"
component={renderUserComponent}
onChange={handleUserNameChange}
value={username}
/><br />
<Field
name="password"
type="password"
label="Password"
component={renderUserComponent}
onChange={handlePasswordChange}
value={password}
/><br /> …Run Code Online (Sandbox Code Playgroud)