javascript - FormData 在react中返回表单提交的空数据

Question

我试图在提交表单时获取表单数据键值对对象，使用 new FormData()构造函数。但它总是返回空数据。

我已经尝试过event.persist()避免 react 事件池，但没有任何效果

export default class Test extends React.Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleSubmit(event) {
    event.preventDefault();
    const target = event.target;
    const data = new FormData(target);
    console.log(data)
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <label htmlFor="username">Enter username</label>
        <input id="username" name="username" type="text" />

        <button>Send data!</button>
      </form>
    );
  }
}

我期待一个包含以下格式的表单数据的对象
{ "username": "Value" }

Answer 1

我认为你需要通过循环来获取它。尝试这个

  var formData = new FormData(target);

   for (var [key, value] of formData.entries()) { 
   console.log(key, value);
  }

希望它有效。