小编Dar*_*ren的帖子

如何在 redux 表单字段中测试 onChange 事件

我想测试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)

javascript testing reactjs redux-form enzyme

5
推荐指数
0
解决办法
944
查看次数

标签 统计

enzyme ×1

javascript ×1

reactjs ×1

redux-form ×1

testing ×1