Compréhension écriture paramètre d'une constante

Bonjour

Je suis en train de suivre un cours de open classRoom et je bute sur un code :

Code:

---

1 2 3 4 5 6 7

const Card = ({ card, feedback }) => ( <div className={`card ${feedback}`}> <span className="symbol"> {feedback === 'hidden' ? HIDDEN_SYMBOL : card} </span> </div> )

---

line 3, pourquoi la className a comme variable card puis la variable feedback ? Sachant que le feedback est dynamique, je ne comprends pas le principe.

Code:

---

const GuessCount = ({ guesses }) => <div className="guesses">{guesses}</div>

---

Celle là je l'ai compris.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

import React from 'react'; import Card from './Card' import GuessCount from './GuessCount' class App extends React.Component { render() { return ( <div className="memory"> <GuessCount guesses={0} /> <Card card="😀" feedback="hidden" /> <Card card="🎉" feedback="justMatched" /> <Card card="💖" feedback="justMismatched" /> <Card card="🎩" feedback="visible" /> <Card card="🐶" feedback="hidden" /> <Card card="🐱" feedback="justMatched" /> </div> ) } }

---

et celle là aussi, c 'était juste pour vous montrer la suite du code dans le app

Merci pour l'aide :)

Salut,

quand tu utilises les quotes inversées, cela signifie que tu peux paramétrer la string:

Code:

---

1 2 3 4

const name = 'Toto'; const hello = `Hello ${name}`; console.log(hello); // Hello Toto

---

Dans ton cas, la valeur de feedback est ajoutée dans les classes de card.

Bonjour,
en gros ta ligne :

Code:

---

<Card card="🎉" feedback="justMatched" />

---

sera insérée dans le document comme :

Code:

---

1 2 3

<div className="card justMatched"> <span className="symbol">🎉</span> </div>

---

c'est de la récupération d'attribut, et l'écriture se fait via les Template literals.

Merci @NoSmoking et @gwyohm, j'ai bien compris

De ce fait, il y aura des noms de className différente et on pourra manipuler la div que l'on souhaiter.


ça semble logique quand on comprends mieux :)

Encore merci