从表单字段中获取价值

时间:2018-11-08 00:54:59

标签: reactjs

我正在尝试从 handleSubmit(event)的表单字段中获取值,但是, new FormData 不会返回这些值。我还需要获取数据还是做错什么?

y

2 个答案:

答案 0 :(得分:0)

您在那里非常依赖浏览器,我会控制状态下的输入,因此您提交时无需查找值:

class Login extends Component {

  constructor(props) {
    super(props);
    this.state = {
      username: '',
      password:'',
    }
    this.handleSubmit = this.handleSubmit.bind(this);
  }
  handleChange = event =>{
      const { target: { name, value } } = event;
      this.setState({[name]: value})
  }

  handleSubmit(event) {
    event.preventDefault();
    const { state: { username, password } } = this;
    const data =  { username, password }

    debugger;
    request({
        url: "/login",
        method: 'POST',
        body: JSON.stringify(data)
    });

  }

  render() {

    return (
      <div>
        <form onSubmit={this.handleSubmit}>
            <label>User/E-mail:</label><br />
            <input onChange={this.handleChange} type="text" id="username" name="username" />
            <br />
            <br />

            <label>Password:</label><br />
            <input onChange={this.handleChange} type="password" id="password" name="password" />
            <br />
            <br />

            <input type="submit" value="Submit" />
        </form>
      </div>
    );
   }
  }

export default Login;

答案 1 :(得分:0)

我是这样子的:

request({
    url: "/login",
    method: 'POST',
    body: JSON.stringify(data)
})
.then(function(response){
    if(response.ok) {
    response.text().then((token) => {
        if(token){
            localStorage.setItem(ACCESS_TOKEN, token)
        }
    })
    }
});