成功"on-submit"后重置表单

Question

我想在成功提交后重置我的表单，我尝试了 reduxForm 指南中提到的"重置"调度，但没有得到任何运气，问题是我不明白在我的表单中添加"重置"的点 下面是我的代码块：

import React from 'react';
import DCTLeft from './DctLeft'
import DCTRight from './DctRight';
import DCTForm from './dctForm';
import { sendNewMessage } from '../../actions/messages';
import {connect} from 'react-redux';
import {reset} from 'redux-form';
class DCT extends React.PureComponent {
    handleSubmit = (value) => {
        this.props.sendNewMessage(value);
      }
render(){
    const { messages } = this.props;
    console.log(messages)
    return (
      <section className="btns">
        <section className="navLR">
          <DCTLeft/>
          <DCTRight/>
        </section>
        <section className="scroll">
          <section className="chat_show">
            {messages && messages.map((messages, index) => (
              <dl key={index}>
              <span className="username">{messages.displayName} :</span> <dd>{messages.text}</dd>
              </dl>
            ))}
          </section>
        </section>
        <DCTForm onSubmit={this.handleSubmit} />
      </section>
    );
}
}
const mapDispatchToProps = dispatch => {
    return {
      sendNewMessage: (msg) => dispatch(sendNewMessage(msg)),
    }
  }
  const mapStateToProps = state => ({
  messages: state.messages.list,
  counter: state.counter.counter
});
export default connect(mapStateToProps,mapDispatchToProps) (DCT);  

提前致谢:)

以下是我的DCTForm代码：

const DCTForm = ({ handleSubmit, onSubmit }) => (
  <section className="chat-bg">
    <form className="chatBoxForm" onSubmit={handleSubmit(onSubmit)}  >
      <section className="input_container">
        <Input
          name="message"
          type="text"
        />
        <img src={Arrow_up} className="icon-static input_img" alt="Arrow_up" />
        <img src={Paper_plane} className="icon-static input_img_2" alt="Paper_plane" />
      </section>
    </form>
  </section>
);
DCTForm.propTypes = {
  handleSubmit: PropTypes.func,
  onSubmit: PropTypes.func
};
DCTForm.defaultProps = {
  handleSubmit: noop,
  onSubmit: noop
};
export default reduxForm({
  form: "DCTForm"
})(DCTForm)

Answer 1

它们在您的组件中注入支持reset函数，此函数重置所有字段的值。你可以在这里查看

而不是从 redux-form 导入，而是从组件属性中获取它