Question

我的注册表单组件在控制台中向我显示警告，提示我从未使用过我的值。

第57行：为“ displayName”分配了一个值，但从未使用过no-unused-vars

第57行：为“电子邮件”分配了一个值，但从未使用过no-unused-vars

第57行：为“密码”分配了一个值，但从未使用过no-unused-vars

第57行：为“ confirmPassword”分配了一个值，但从未使用过no-unused-vars

以下是我认为是问题的一些代码。

            this.setState({
                displayName: '',
                email: '',
                password: '',
                confirmPassword: '',
            })
        } catch (error) {
            console.log(error);
        }
 }
      handleChange(event) {
        const { name, value } = event.target;

        this.setState({ [name]: value });
    }
    render(){
        const { displayName, email, password, confirmPassword } = this.state
        return(
            <div className='SignUpForm'>
            <h2 className='signupTitle'>New here? Sign up for an account.</h2>
            <form className='Signin' onSubmit={this.handleSubmit} noValidate autoComplete="off">

            <TextField
              className='displayName'
              name='displayName'
              id="standard-name"
              type='text'
              label="Display Name"
              margin="normal"
              onChange={this.handleChange}
              value={this.state.displayName}
              required
            />

            <TextField
              className='email'
              name='email'
              id="standard-name"
              type='text'
              label="Email"
              margin="normal"
              onChange={this.handleChange}
              value={this.state.email}
              required
            />

              <TextField
             className='password'
             name='password'
             type='password'
             id="standard-password-input"
            label="Password"
            margin="normal"
            onChange={this.handleChange}
            value={this.state.password}
            required
            />

              <TextField
             className='confirmPassword'
             name='confirmPassword'
             type='password'
             id="standard-password-input"
            label="Confirm Password"
            margin="normal"
            onChange={this.handleChange}
            value={this.state.confirmPassword}
            required
            />

注册表单可以正常工作，并且新用户已添加到Firebase数据库。

谢谢。

Answer 1

此行引起警告，

const { displayName, email, password, confirmPassword } = this.state

在这里，您将状态放入单独的变量中，但未在代码中的任何地方使用它们。

您有两种方法，

要么删除此行。
或者您可以像使用它们一样

<TextField
  className='displayName'
  name='displayName'
  id="standard-name"
  type='text'
  label="Display Name"
  margin="normal"
  onChange={this.handleChange}
  value={displayName}   //Instead of this.state.displayName use displayName only
  required
/>

像这样，您可以在其他适当的TextField中使用其他变量。

分配值，但从未在React表单上使用

1 个答案: