在react中提交后清除文本字段

在React中，提交表单后清除文本字段可以通过以下步骤完成：

创建一个类组件，并在其构造函数中初始化文本字段的状态。例如，可以使用state对象来保存文本字段的值。

class Form extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      inputValue: ''
    };
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleChange = this.handleChange.bind(this);
  }
  
  handleSubmit(event) {
    // 阻止表单默认提交行为
    event.preventDefault();
    
    // 提交表单逻辑
    // ...
    
    // 清除文本字段的值
    this.setState({ inputValue: '' });
  }
  
  handleChange(event) {
    // 更新文本字段的值
    this.setState({ inputValue: event.target.value });
  }
  
  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <input
          type="text"
          value={this.state.inputValue}
          onChange={this.handleChange}
        />
        <button type="submit">提交</button>
      </form>
    );
  }
}

在表单的提交处理函数handleSubmit中，使用event.preventDefault()方法阻止表单默认的提交行为，以便在提交表单逻辑处理完成后执行清除文本字段的操作。
在文本字段的onChange事件处理函数handleChange中，使用event.target.value获取文本字段的值，并通过setState方法更新组件的状态，以便实时显示输入的内容。

这样，在用户提交表单后，文本字段的值将被清空，以便下一次输入。