Je suis en train d'apprendre en train d'apprendre si d'autre instruction dans réaction,
donc je veux que le bouton de la table apparaisse si la variable "étape" est définie sur 1, autrement que celle-ci (et la ligne) n'apparaîtra pas. . Quelle méthode est la meilleure à implémenter cela si sinon?
4 Réponses :
Voici comment faire un rendu conditionnel
<td>
{ step === 1 ?
<button type="button"
className="btn btn-default"
onClick={handleDeleteClick}
disabled={!hasDeleteButton}>Hapus</button>
: null
}
</td>
Merci! est le ': null' dans le code le ele cas?
Oui, cela s'appelle un opérateur ternaire, qui agit comme si / sinon
Vous pouvez utiliser l'opérateur && code> qui signifie si et uniquement si code> est vrai code>. C'est un raccourci de si-ele code> mais plus simple et lisible.
Mais si vous voulez faire quelque chose d'autre si votre condition est false code> puis utilisez if-ele code>. {step === 1 && (
<td>
<button
type="button"
className="btn btn-default"
onClick={handleDeleteClick}
disabled={!hasDeleteButton}
>
Hapus
</button>
</td>
)}
Merci! celui-ci (si et seulement si condition) est nouveau pour moi et je pense que c'est la solution la plus élégante
Vous ne pouvez pas utiliser la déclaration si / else à l'intérieur du retour, je pense. Vous avez deux possibilités, ternaire à l'intérieur de rendu comme celui-ci ou un sous-composant tel que ici
Oui, vous pouvez. Découvrez le premier commentaire.
Si je comprenais votre question correctement, nous pouvons le faire en deux voies (connu pour moi). ou P> return (
{ step === 1 && <tr>...</tr> }
{ step === 0 && </>}
);
J'ai essayé votre solution et peut confirmer les deux œuvres!
Content de le savoir. Marquez-la comme répondu si vous estimez que cela a aidé pour que d'autres puissent en tirer profit. @Buffaurus
Est-ce que cela répond à votre question? Si-else Statement à l'intérieur JSX: ReactJS
réactjs.org/docs/conditionnelle-rending.html