form icon indicating copy to clipboard operation
form copied to clipboard

use constraint validation

Open jimmywarting opened this issue 7 years ago • 0 comments

Normally i may not have included rc-form on my own. I was assigned to a project that uses rc-form. And I can't understand how this:

class Form extends React.Component {
  componentWillMount() {
    this.requiredDecorator = this.props.form.getFieldDecorator('required', {
      rules: [{required: true}],
    });
  }

  submit = () => {
    this.props.form.validateFields((error, value) => {
      console.log(error, value);
    });
  }

  render() {
    let errors;
    const { getFieldError } = this.props.form;
    return (
      <div>
        {this.requiredDecorator(
          <input />
        )}
        {(errors = getFieldError('required')) ? errors.join(',') : null}
        <button onClick={this.submit}>submit</button>
      </div>
    );
  }
}

...is any better/easier to write then just doing stuff with native form validation

class Form extends React.Component {
  submit (evt) {
    // Will only be trigger when the form is valid
  }

  render () {
    return (
      <form onSubmit={this.submit}>
        <input required>
        <button type="submit">submit</button>
      </form>
    );
  }
}

You are reinventing the wheel with custom shenanigans and forces developer to learn how to do it "your way"

jimmywarting avatar Feb 08 '19 11:02 jimmywarting