Как мы можем сбросить эту Redux-форму в React? - PullRequest
0 голосов
/ 18 октября 2019

Когда я отправляю форму, она сохраняет значения внутри входных данных. Я читал, что сброс может быть использован здесь для очистки, сброса формы, но не уверен, как? Похоже, что это может быть включено для сброса, но где именно?

import {reset} from 'redux-form';

dispatch(reset('AppForm'));

компонент

import { Field, reduxForm, reset } from 'redux-form';
        ...

        class APPForm extends React.Component {
          state = {
          }
          render() {
            var { handleSubmit, pristine, submitting, submitCb, valid, resetSection } = this.props;

            return (
              <form onSubmit={handleSubmit(submitCb)}>
                <Field
                  name="email"
                  type="email"
                  className='form-control'
                  component={AppInput}
                />
                <Field
                  name="title"
                  type="text"
                  className='form-control'
                  component={AppInput}
                />
                <button className='btn' type="submit" disabled={!valid || pristine || submitting}>
                  Send
                </button>
              </form>
            )
          }
        }
...
export default reduxForm({
  form: 'AppForm',
  validate
})(AppForm)

Также вот основной компонент, включая выше один:

export default class AppMain extends React.Component {

  constructor() {
    super();

    this.state = {
      errors: [],
      note: ''
    }

    this.pristine = false;

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


  Send(someData) {
    someData = { ...someData};
    this.sendData(someData).then(
      submited => this.setState({ note: 'Data sent successfully' }),
      errors => this.setState({ errors })
    );
  };

  sendData = (someData) => {
    return axios.post('/api/v1/submit', someData).then(
      res => res.data,
      err => Promise.reject(err.response.data.errors)
    )
  };

  render() {
    const { errors } = this.state;

    return (
      <section id='submit'>
        <div className='bwm-form'>
          <div className='row'>
            <div className='col-md-7'>
              <h1>Submit</h1>
              <AppForm submitCb={this.Send} errors={errors} pristine={this.pristine} />
            </div>
          </div>
        </div>
      </section>
    )
  }
}

Магазин

import { createStore, compose, combineReducers } from 'redux';

import { reducer as formReducer } from 'redux-form';

export const init = () => {
  const reducer = combineReducers({
    form: formReducer,
  });

Где и как мы должны включить вышеупомянутый dispatch(reset('AppForm')); в приведенный выше код?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...