1
votes

Dans un composant React, les balises

Je me demande s'il y a des avantages à la balise si je vais câbler mon bouton en tant que type = "button".

J'ai essayé à l'intérieur et à l'extérieur de la balise, mais je ne vois aucun avantage d'avoir une balise.

    <div className="form">
      <form>
        <h4>Desired Username: </h4>
        <input
          type="text"
          name="uName"
          value={this.state.uName}
          onChange={this.userInput}
          placeholder="Desired Username"
        />
        <h4>Password: </h4>
        <input
          type="password"
          name="pass"
          value={this.state.pass}
          onChange={this.userInput}
          placeholder="Type Password Here"
        />
        <h4>Password Confirm: </h4>
        <input
          type="password"
          name="passConf"
          value={this.state.passConf}
          onChange={this.userInput}
          placeholder="Retype Your Password"
        />
        <br />
        <br />
        <button type="button">Register User</button>
      </form>
    </div>

reactjs html

1 commentaires

Il y avait quelques différences subtiles avec le bouton à l'intérieur d'un formulaire. 1. Si , le bouton hériterait du type et soumettrait le formulaire. 2. Si était utilisé comme une simple balise, le bouton serait par défaut type = "button". 3. Si et

3 Réponses :

0
votes

Votre question n'est pas uniquement liée à la réaction, il y a une question similaire à ce sujet ici: Ai-je besoin de role = "button" sur un

2 commentaires

Le role et le type sont des choses différentes.

@apokryfos - sûr que "Adding role =" button "fera apparaître un élément comme un contrôle de bouton à un lecteur d'écran", mais la question à laquelle j'ai lié parle de rôle et de type

1
votes

Lorsque type = "button", le bouton fonctionnera comme un bouton normal, ce qui sera le même si vous le mettez à l'intérieur ou à l'extérieur du formulaire.

Mais le formulaire est quelque chose que vous soumettez au serveur, donc dans ce cas, vous devez avoir type = "submit", et le bouton doit être à l'intérieur du formulaire, parce que si vous donnez type = "submit" et mettez le bouton en dehors du formulaire alors vous ne soumettez rien.

J'espère que cela dissipe votre doute

0 commentaires

0
votes

La méthode habituelle pour soumettre des formulaires consiste à conserver la balise bouton à l'intérieur du formulaire.

Si le bouton se trouve à l'intérieur de la balise formulaire, vous devez lui donner le type soumettre et sur la balise formulaire inclure l'événement onSubmit avec une fonction à appeler lorsque le bouton est cliqué.

<form>
//Input fields
</form>
<button onClick={this.onClick}>Submit form details</button>

Si vous préférez garder le bouton en dehors de la balise form, vous devrez mettre un onClick sur le bouton et prenez les valeurs d'entrée via l'état.

<form onSubmit={this.onSubmit}>
//Input fields
<button type="submit">Submit</button>
</form>

L'une des principales différences entre les deux est que la touche «entrée» en cours de frappe est considérée comme une soumission mais lorsqu'un onclick est utilisé, il peut ne pas être considéré comme un onclick.

2 commentaires

Bien que cette réponse soit techniquement correcte, elle ne répond pas réellement à la question de savoir pourquoi choisir l'un ou l'autre

L'une des principales différences entre les deux est que la touche «entrée» frappée est considérée comme une soumission, mais lorsqu'un clic est utilisé, il peut ne pas être considéré comme un clic.

Dans un composant React, les balises ont-elles des avantages à vivre à l'intérieur d'une balise ou à vivre en dehors de la balise ?

Dans un composant React, les balises