Reactstrap 表單輸入 innerRef 返回 null

Question

嘗試將輸入數據發送到 console.log 但它似乎無法正常工作。 我希望能夠從身份驗證登錄控制台電子郵件和密碼。

這是我的構造函數和 onChange：

  constructor(props) {
    super(props);

    this.state = {
      email: "",
      password: "",
      errors: {}
    };

    this.onChange = this.onChange.bind(this);
  }

  onChange = e => {
    this.setState({
      [e.target.id]: e.target.value
    });
  }

這是我的 onSubmit：

onSubmit = e => {
    e.preventDefault()

    const userData = {
      email: this.state.email,
      password: this.state.password
    };

    console.log(userData);
  }

這是我從表單輸入的內容：

<Input
  name="email"
  type="email"
  onChange={this.onChange}
  innerRef={this.state.email}
  error={errors.email}
/>

沒有收到任何錯誤，只是電子郵件和密碼返回空值。

Answer 1

您必須將onChange函數更改為：

onChange = e => {
  this.setState({
    [e.target.name]: e.target.value
  });
}

我認為這必須解決你的問題