From 6ec1f12d1323a1c3986cf11305f815f34f59aa22 Mon Sep 17 00:00:00 2001 From: Thomas Fritsch <thomas@uidlt.fr> Date: Tue, 2 Feb 2021 17:04:11 +0100 Subject: [PATCH] =?UTF-8?q?Pr=C3=A9cisions=20D.1.3=20objectifs=20PizzaThum?= =?UTF-8?q?bnail?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- D-poo-avancee.md | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/D-poo-avancee.md b/D-poo-avancee.md index af0ddfc..f7f7e74 100644 --- a/D-poo-avancee.md +++ b/D-poo-avancee.md @@ -57,7 +57,15 @@ _**L'objectif de cet exercice est d'utiliser une classe à l'intérieur d'une au > _vérifiez que votre classe `Component` ajoute bien la classe CSS `pizzaThumbnail`_ > _sur la balise `<article>`..._ -3. **Créez une classe `PizzaThumbnail`** (dans `src/components/PizzaThumbnail.js`) avec le code suivant : +3. **Grâce aux modifications que l'on vient de faire sur la classe `Component`,** + **on peut maintenant créer la classe `PizzaThumbnail`** (dans `src/components/PizzaThumbnail.js`). + + `PizzaThumbnail` est en fait un `Component` auquel on peut passer un objet "pizza" + (_une cellule du tableau `data`_) et qui est capable de générer le même code HTML + que ce que l'on avait fait dans le TP1. + + Je vous fourni son code car l'intérêt ici, est simplement de **s'assurer que votre classe `Component`** + **gère bien les différents cas limites** : ```js export default class PizzaThumbnail extends Component { @@ -84,7 +92,8 @@ _**L'objectif de cet exercice est d'utiliser une classe à l'intérieur d'une au Dans le `src/main.js`, testez votre classe avec le code suivant : ```js - const pizzaThumbnail = new PizzaThumbnail(data[0]); + const pizza = data[0]; + const pizzaThumbnail = new PizzaThumbnail(pizza); document.querySelector( '.pageContent' ).innerHTML = pizzaThumbnail.render(); ``` -- GitLab