Question

我最近一直在和React一起玩，非常喜欢它，但是我错过了我曾经在其他框架中使用的一些东西。这些来自角度，角度的ngForm中的主要用于提供非常简单的表单验证。检查有效的表单是否与vm.myForm一样简单。$ valid。

在反应中，我发现自己写了大量的样板，基本上重复了我在ngForm中所拥有的内容。我想知道是否有用于表单验证的插件，如果没有，社区有一种首选方式进行验证？

Answer 1

强烈推荐formsy-react，使用此库，您可以轻松自定义所有验证和错误消息。

那么你的代码就是，

 import Formsy from 'formsy-react';

  const MyAppForm = React.createClass({
    getInitialState() {
      return {
        canSubmit: false
      }
    },
    enableButton() {
      this.setState({
        canSubmit: true
      });
    },
    disableButton() {
      this.setState({
        canSubmit: false
      });
    },
    submit(model) {
      someDep.saveEmail(model.email);
    },
    render() {
      return (
        <Formsy.Form onValidSubmit={this.submit} onValid={this.enableButton} onInvalid={this.disableButton}>
          <MyOwnInput name="email" validations="isEmail" validationError="This is not a valid email" required/>
          <button type="submit" disabled={!this.state.canSubmit}>Submit</button>
        </Formsy.Form>
      );
    }
  });

以下是some examples和API documents。

反应版本的ngForm

1 个答案: