Cheatsheet des opérateurs ternaires Vue.js

Parce que j’en ai marre de chercher à chaque fois sur internet la syntaxe des opérateurs ternaires pour Vue.js, les voici listés ici ! Laisse un commentaire si tu en connais d’autres, que je les rajoute à la liste 😉

Dans le corps de la balise

Opérateur ternaire classique

<div id="food-color">
    {{ food === 'tomato' ? 'red' : 'green' }}
<div>

Dans les attributs de la balise

Opérateur ternaire classique

<div :class="food === 'tomato' ? 'color-red' : 'color-green'">
    {{ food }}
<div>

Opérateur ternaire à une seule option

<div :class="{'color-red' : food === 'tomato'}">
    {{ food }}
<div>

Voilà, j’espère que ce post t’aidera autant qu’il m’aide moi 😁

1 commentaire pour “Cheatsheet des opérateurs ternaires Vue.js”

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

J’accepte les conditions et la politique de confidentialité