web-dev-qa-db-fra.com

Comment montrer des messages d'erreur ou de validation uniquement après que le formulaire soit soumis et non lorsque l'utilisateur tape STDD?

J'ai créé un formulaire à l'aide d'Ant Design avec ReactJS. Cela fonctionne très bien, sauf que cela montre des messages d'erreur que j'ai spécifiés pour chaque champ sous le champ de saisie avant que le bouton "Soumettre" est même cliqué et que l'utilisateur saisit. Il a l'air très étrange et je voudrais changer ce comportement. Je souhaite montrer ces messages uniquement une fois le bouton Soumettre cliqué. Y a-t-il un moyen de le faire?

J'ai traversé le Doc officiel. Je n'ai rien trouvé concernant le "Validator Async" ou "GetFieldDecorator" qui suggérait ce que je voulais réaliser.

Le "getfieldDecorator" pour spécifier des règles de validation et des messages d'erreur pour chaque champ est défini de cette manière:

<Form.Item label="Title" style={{ margin: 0 }}>
  {getFieldDecorator('Title', {
    rules: [{ required: true, message: 'Please input the title', whitespace: true }], initialValue: title
  })(<Input onChange={this.onTitleChange.bind(this)} value={title} />)}
</Form.Item>

Ma méthode "Onsubmit ()" ressemble à ceci:

handleSubmit = () => {
  this.props.form.validateFields((err, values) => {
    if (err) {
      return;
    }
    this.handleSaveBanner();
  });
};

Attendu est de montrer des messages d'erreur uniquement après que le bouton Soumettre clique et non avant même que l'utilisateur Type des entrées non valides ou la laisse en blanc. L'aide serait appréciée depuis que je suis nouveau à réagir.

reactjsantd
4
gameFrenzy07

S'il vous plaît regarder à travers cela. https://ant.design/components/form/#getfieldCorator (ID, -OPTIONS) -PARAMETERS . Il y a une option nommée validateTrigger. Il peut contrôler quand faire la validation. Souhaitez que cela puisse vousyer vous.

5
Ma Tianqi